@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,700;0,800;1,300;1,400;1,500;1,700;1,800&display=swap');

html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Montserrat', sans-serif;
	scroll-behavior: smooth;
	overflow-x:  hidden;
	width:  100%;
	max-width:  100%;
}

.social {
	position: absolute;
	z-index: 99;
	right: 8%;
	top: 15px;
}
.social img {
	width: 30px;
}
a {
	text-decoration: none;
}
.text-azul {
	color: #1d2074;
}
.text-verde {
	color: #a5ce37;
}
.bg-laranja {
	background: #F68633;
}
.bg-azul {
	background: #1d2074;
}
.bg-verde {
	background: #a5ce37;
}

.bg-gradientazul {
	background: rgb(13,71,149);
	background: linear-gradient(90deg, rgba(13,71,149,1) 0%, rgba(42,44,121,1) 100%);
}

.mercado .rodape {
	margin-top: -70px;
}	

.g1 {
	background: url(../img/g1-bg.webp) no-repeat;
	background-size: 100% auto !important;
	background-position: top center;
	height: 300px;
	position: relative;
}

.fs-md-5 {
	font-size: 1.2em;
}

.seta {
	width: 25px;
	position: absolute;
	top: 44%;
}
.seta.esq {
	left: 30px;
}
.seta.dir {
	left: inherit;
	right: 30px;
}

.emporio {
	background: #373435;
}
.emporio .logo-emporio {
	height: 50px;
}
.emporio .tel {
	width: 9rem;
}
.apps {
	height: 40px;
}

.footer {
	position: relative;
}
.footer .loja {
	width: 50px;
}
/* a onda do Empório sobe 5rem sobre o rodapé; sem folga ela cobre os links */
.footer nav {
	padding-bottom: 2.5rem;
}
.footer .tel {
	width: 9rem;
	display: block;
	margin: 0 auto;
}






@media(max-width: 768px) {
	.social {
		right: 4%;
	}
	.g1 {
		height: 100px;
		background-size: auto 100% !important;
	}
	.mercado .rodape {
		margin-top: -5px;
	}
	.footer {
		background-color: #2a2c79;
	}
	.footer .border-end {
		border-right: none !important;
		border-bottom: 1px solid #fff;
	}
	.seta {
		width: 15px;
		top: 35%;
	}
	.seta.esq {
		left: 10px;
	}
	.seta.dir {
		left: inherit;
		right: 10px;
	}
	.tuto .seta {
		top: 48%;
		width: 30px;
	}
	.tuto .seta.esq {
		left: -55px;
	}
	.tuto .seta.dir {
		right: -55px;
	}
}

.imagem-flutuante {
	position: absolute;
	z-index: 5;
	height: 8rem;
}
.imagem-flutuante-esquerda {
	left: 10%;
	top: 10%;
}
.imagem-flutuante-direita {
	right: 10%;
	bottom: 12%;
}

/* Container do divisor */
.onda {
    position: relative;
    width: 100%;
    overflow: hidden;
    line-height: 0;
	margin-top: -5rem;
}

/* Garante que o SVG ocupe toda a largura e ajuste a altura */
.onda svg {
    position: relative;
    display: block;
    width: 100%;
    height: 80px; /* Você pode aumentar ou diminuir a altura da onda aqui */
}

/* Controla a cor de preenchimento da onda */
.onda svg path {
    fill: #ffffff; /* Substitua pela cor desejada (Hex, RGB ou nome) */
}

.emporio-onda svg path {
	fill: #373435;
}

@media(max-width: 768px) {
	.imagem-flutuante {
		height: 3.7rem;
	}

	.imagem-flutuante-direita {
		bottom: 10%;
	}
	.onda {
		margin-top: -1.8rem;
	}

	.onda svg {
		height: 32px;
	}
}