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

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:#ffffff;
color:rgb(0, 0, 0);
line-height:1.6;
font-family: 'Poppins';
}

html{
scroll-behavior:smooth;
}

.container{
width:90%;
max-width:1200px;
margin:auto;
}

/* ======================
WHATSAPP FLOAT
====================== */

.whatsapp-float{

position:fixed;

bottom:25px;
right:25px;

width:60px;
height:60px;

background:#25d366;

color:white;

border-radius:50%;

display:flex;

align-items:center;
justify-content:center;

font-size:28px;

text-decoration:none;

box-shadow:0 10px 30px rgba(0,0,0,0.4);

z-index:999;

transition:0.3s;

animation:pulse 2s infinite;

}

/* hover */

.whatsapp-float:hover{

transform:scale(1.1);

box-shadow:0 15px 40px rgba(0,0,0,0.6);

}


/* animação pulsando */

@keyframes pulse{

0%{

box-shadow:0 0 0 0 rgba(37,211,102,0.6);

}

70%{

box-shadow:0 0 0 20px rgba(37,211,102,0);

}

100%{

box-shadow:0 0 0 0 rgba(37,211,102,0);

}

}
/* ======================
LOADER BASE
====================== */

#loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #0a0a0a;
  z-index: 9999;
  overflow: hidden;
}

/* ======================
TEXTO
====================== */

.loading-text {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 24px;
  letter-spacing: 2px;
  transform: translateY(-50%);
  z-index: 2;
}

/* ======================
ÁGUA
====================== */

.water {
  position: absolute;
  bottom: -100%;
  width: 100%;
  height: 100%;
  background: #0086f3;
  animation: rise 2.5s ease-in-out forwards;
}

/* ondas */
.wave {
  position: absolute;
  top: -80px;
  width: 200%;
  height: 100px;
  background: url("https://svgshare.com/i/13kU.svg");
  background-size: contain;
  background-repeat: repeat-x;
}

.wave1 {
  animation: waveMove 5s linear infinite;
  opacity: 0.8;
}

.wave2 {
  animation: waveMove 8s linear infinite;
  opacity: 0.4;
}

/* ======================
ANIMAÇÕES
====================== */

/* água subindo */
@keyframes rise {
  0% {
    bottom: -100%;
  }
  100% {
    bottom: 0;
  }
}

/* onda mexendo */
@keyframes waveMove {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}



/* ======================
MOBILE azul claro #0086f3 azul escuro #0069be
====================== */

@media (max-width:768px){

.whatsapp-float{

width:55px;
height:55px;

font-size:24px;

bottom:20px;
right:20px;

}

}