/* Slider e rolagem da LP: reproduzem o Slider Revolution e o niceScroll do site online. dev @ nerdweb */

@font-face {
	font-family: revicons;
	src: url("revicons.woff") format("woff"), url("revicons.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

/* Layout "fullwidth" com grade 1920x1080; abaixo de 778 px a grade e 778x500 e abaixo de 480 px, 480x400.
   A altura sai da largura da janela inteira (100vw, com a barra de rolagem), como no Slider Revolution */
.nw-hero { position: relative; width: 100%; height: calc(100vw * 1080 / 1920); overflow: hidden; }
@media (max-width: 777px) { .nw-hero { height: calc(100vw * 500 / 778); } }
@media (max-width: 479px) { .nw-hero { height: calc(100vw * 400 / 480); } }

.nw-slide {
	position: absolute; inset: 0;
	background-size: cover; background-position: center center; background-repeat: no-repeat;
	opacity: 0; transition: opacity .3s linear;
}
.nw-slide.on { opacity: 1; }

/* Setas "hesperiden" (offset 30 px, centradas) e bolinhas "hephaistos" (30 px do fundo, espaco 5 px).
   Aparecem com o mouse sobre o slider, somem 200 ms depois de sair e nunca abaixo de 600 px nem em toque */
.nw-arrow, .nw-bullets { opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.nw-hero.nw-nav .nw-arrow, .nw-hero.nw-nav .nw-bullets { opacity: 1; visibility: visible; }
@media (max-width: 599px) { .nw-arrow, .nw-bullets { display: none; } }
.nw-touch .nw-arrow, .nw-touch .nw-bullets { display: none; }

.nw-arrow {
	cursor: pointer; background: rgba(0, 0, 0, .5); width: 40px; height: 40px;
	position: absolute; top: 50%; margin-top: -20px; display: block; z-index: 100;
	border-radius: 50%; border: 0; padding: 0;
}
.nw-arrow:hover { background: #000; }
.nw-arrow::before {
	font-family: revicons; font-size: 20px; color: #fff; display: block;
	line-height: 40px; text-align: center;
}
.nw-prev { left: 30px; }
.nw-next { right: 30px; }
.nw-prev::before { content: "\e82c"; margin-left: -3px; }
.nw-next::before { content: "\e82d"; margin-right: -3px; }

.nw-bullets {
	position: absolute; z-index: 1000; bottom: 30px; left: 50%; transform: translateX(-50%);
	display: flex; gap: 5px;
}
.nw-bullets span {
	width: 12px; height: 12px; background: #999; border: 3px solid rgba(255, 255, 255, .9);
	border-radius: 50%; cursor: pointer; box-sizing: content-box;
	box-shadow: 0 0 2px 1px rgba(130, 130, 130, .3);
}
.nw-bullets span:hover, .nw-bullets span.selected { background: #fff; border-color: #000; }

/* niceScroll do tema: trilho de 10 px, cursor #222 com raio 5, so a partir de 768 px fora de toque */
@media (min-width: 768px) and (hover: hover) {
	/* Chrome e Safari: ::-webkit-scrollbar (o Chrome ignora essas regras se scrollbar-color existir) */
	html::-webkit-scrollbar { width: 10px; }
	html::-webkit-scrollbar-track { background: transparent; }
	html::-webkit-scrollbar-thumb { background: #222; border-radius: 5px; }
	/* Firefox */
	@supports (-moz-appearance: none) { html { scrollbar-color: #222 transparent; scrollbar-width: thin; } }
}