@import url('https://fonts.googleapis.com/css2?family=Geologica:wght@100..900&display=swap');


hr {
	border-bottom: 0.0625rem dashed var(--cor-primaria);
	border-top: 0.15rem solid var(--color-header-text);
	margin: var(--spacing-medium) 0;
}


nav {
	position: sticky;
	top: 0;

	width: 100%;
	z-index: 2;

	display: inline-flex;
	padding: var(--spacing-medium);

	color: var(--cor-primaria);
	background-color: var(--cor-fundo-primario);

	box-shadow: 0 0 2rem rgba(0, 0, 0, 0.25);
}
.nav-links {
	display: inline-flex;
	flex-wrap: wrap;

	width: 100%;
	gap: 0.5rem;
}
.nav-tema {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;

	width: 25%;
	gap: 0.5rem;
}

nav button {
	text-align: center;
	width: 100%;

	padding: var(--spacing-small);
	margin-left: var(--spacing-medium);
}


header {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	position: relative;
	text-align: center;

	padding: 8rem 1.375rem 15rem 1.375rem;

	color: var(--cor-texto-branco);
	border-bottom: 0.1875rem solid var(--cor-primaria-escuro);

	overflow: hidden;
}
header::before {
	content: "";
	position: absolute;
	inset: 0;

	background: url("../img/promo/header.jpg") center/cover no-repeat;
	filter: grayscale(100%) brightness(60%);

	z-index: -2;
}
header::after {
	content: "";
	position: absolute;
	inset: 0;

	mix-blend-mode: overlay;
	background: linear-gradient(45deg,
		var(--cor-primaria),
		var(--cor-secundaria)
	);

	z-index: -1;
}


.header-banner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	padding-bottom: 0.9375rem;
}
.header-logo {
	border: none;
	filter: brightness(100);

	width: clamp(6rem, 10vw + 2rem, 9.375rem);
	height: clamp(6rem, 10vw + 2rem, 9.375rem);

	margin-bottom: var(--spacing-medium);
}


.header-texto p {
	font-size: clamp(1.5rem, 3vw + 0.5rem, 2rem);
	margin-bottom: var(--spacing-small);
}
.header-texto h1 {
	line-height: 1.0;
	font-size: clamp(3rem, 7vw + 1rem, 5.375rem);
}


.header-call-to-action {
	color: var(--cor-texto-secundario);
	background-color: var(--cor-fundo-secundario);

	padding: 4rem;
	border-radius: 0.625rem;

	box-shadow: 0 0.25rem 1.5rem rgba(0, 0, 0, 0.5);
}
.header-call-to-action h1 {
	font-size: clamp(2rem, 4vw + 1rem, 3rem);
	margin-bottom: var(--spacing-small);
}

.header-call-to-action h2 {
	font-weight: 200;

	margin-bottom: var(--spacing-large);
	font-size: clamp(1.5rem, 3vw + 0.5rem, 1.75rem);
}

.header-call-to-action button {
	font-size: clamp(1.25rem, 2vw + 0.5rem, 1.5rem);

	padding: var(--spacing-medium);
	width: clamp(15.625rem, 80%, 31.25rem);
}


.conteudo-secao {
	display: grid;

	gap: 2rem;
	grid-template-columns: repeat(auto-fit, minmax(18.75rem, 1fr));
}


.diferencial {
	gap: 0.1rem;
	/* display: flex; */
}
.imagem-diferencial {
	gap: 1.6rem;
	display: flex;
}
.imagem-curiosidade {
	gap: 1.6rem;
	display: flex;
}


.promo_image,
iframe {
	width: 100%;
	height: auto;
}


.article {
	border-radius: 0.625rem;

	padding: var(--spacing-large);
	margin-bottom: var(--spacing-medium);

	background-color: var(--cor-fundo-primario);
	box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
}
.article h2 {
	text-transform: uppercase;
	text-align: center;

	padding: 10px;
	margin-bottom: 20px;
	border-radius: 0.625rem;

	color: var(--cor-texto-branco);
	background-color: var(--cor-primaria);
}
.article p {
	margin-bottom: 0.3875rem;
}
.article strong {
	margin-top: 0.5875rem;
	display: block;
}


#section-diferenciais .diferencial,
#section-curiosidades .curiosidade {
	gap: 100px;

	margin-bottom: 0.9375rem;
	padding-bottom: 1.5rem;

	border-bottom: 0.0625rem dashed var(--cor-primaria);
}


#section-diferenciais .diferencial:last-child,
#section-curiosidades .curiosidade:last-child {
	padding-bottom: 0.1rem;
}


#section-diferenciais .diferencial:last-child,
#section-curiosidades .curiosidade:last-child {
	border-bottom: none;
}


#section-diferenciais .diferencial,
#section-curiosidades .curiosidade {
	margin-bottom: var(--spacing-small);
}


#section-diferenciais .diferencial h3,
#section-curiosidades .curiosidade h3,
#section-diferenciais .diferencial i,
#section-curiosidades .curiosidade i {
	color: var(--cor-primaria);
}


.titulo-diferencial {
	display: flex;
	align-items: center;

	gap: 8px;
}


.imagem-diferencial img,
.imagem-curiosidade img {
	width: clamp(9rem, 15vw + 3rem, 15.625rem);
	height: clamp(9rem, 15vw + 3rem, 15.625rem);
}


.titulo i {
	margin-right: 16px;
}


#estrelas {
	font-size: clamp(1.5rem, 2vw + 1rem, 1.75rem);
	color: gold;
}


.avaliacao {
	display: flex;
	/* flex: 1 1 18rem; */
	flex-direction: column;
	/* justify-content: space-between; */

	padding: var(--spacing-medium);

	border-radius: 0.625rem;
	border: solid 1px var(--cor-borda);
	
	box-sizing: border-box;
}
/* .avaliacao-texto {
	height: 51%;
} */


#article-reviews {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: stretch;
}

#article-reviews button {
	display: block;
	margin: 0 auto;
}


.div_autor {
	display: inline-flex;
	gap: 8px;
}
.div_autor small {
	position: relative;
	top: 3px;
}
.autor_pfp {
	cursor: pointer;

	border-radius: 100%;
	border: solid 1px var(--cor-primaria);

	width: 25px;
	height: 25px;
}


.carousel-container {
	border-radius: 0.625rem;
	padding-bottom: 1.5rem;

	background-color: var(--color-article-background);
}
.carousel-track {
	gap: 1rem;
	display: flex;
	flex-wrap: w;
	flex-direction: column;
}