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

body{
	background:url("img/back_principal.jpg");	
/*background:#f5f5f5;*/
color:#003399;
}

body a{
	text-decoration:none;
}

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

.topo{
	background:url("img/back_principal.jpg");
	
/*background:white;*/
padding:15px 0;
}

.menu{
display:flex;
justify-content:space-between;
align-items:center;
}

.logo span{
color:#ff5b3a;
}


.logo img{
height:70px;
width:auto;
display:block;

}

/*estilo novo menu*/
nav ul {
    display: flex;
    list-style: none;
    gap: 30px;
}

nav a {
    text-decoration: none;
    color: #003399;
    font-weight: bold;
    font-size: 20px;
    transition: 0.3s ease; /* animação suave */
}

/* efeito ao passar o mouse */
nav a:hover {
    color: #f8bd3d;
}

.btn-reserva{
background:#556b2f;
color:white;
padding:8px 18px;
border-radius:5px;
cursor:pointer;
}

.hero{

height:420px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.hero-texto h2{
margin-top:30%;
font-size:42px;
margin-bottom:10px;
text-shadow: 1px 1px 1px #000000;
}

.hero-texto p{
margin-bottom:20px;
font-weight: bolder;
text-shadow: 1px 1px 1px #000000;
}

.btn-hero{
background:#f5a623;
padding:12px 25px;
border-radius:6px;
cursor:pointer;
}



.btn-hero:hover{
	background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    background-size: 300% 300%;
    animation: instaGradient 3s ease infinite;
    box-shadow: 0 0 25px rgba(228,64,95,0.8);
	
}

.acomodacoes{
padding:60px 0;
text-align:center;
}

.grid-acomodacoes{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;
margin-top:30px;
}

.card{
background:white;
border-radius:8px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
}

.card img{
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 10px;
}

.card h3{
padding:15px;
}

.btn-card{
display:inline-block;
background:#f5a623;
color:white;
padding:8px 18px;
margin-bottom:20px;
border-radius:5px;
font-weight:bold;
}

.vantagens{
background:#eee;
padding:60px 0;
text-align:center;
}

.grid-vantagens{
margin-top:30px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.item{
background:white;
padding:20px;
border-radius:8px;
}

.descubra{
padding:60px 0;
text-align:center;
}

.grid-descubra{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
margin-top:30px;
}


.grid-descubra .card img{
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 10px;
}

footer{
background:#1f2a44;
color:white;
padding:40px 0;
}

.grid-footer{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
}

footer h3{
margin-bottom:10px;
}

.instagram-link {
    text-decoration: none;
    color: #333;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.instagram-icon {
    width: 25px;
    height: 25px;
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, 
                #fd5949 45%, #d6249f 60%, #285AEB 90%);
    border-radius: 5px;
    position: relative;
}

.instagram-icon::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 10px;
    height: 10px;
    border: 2px solid white;
    border-radius: 50%;
}

.instagram-icon::after {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: 3px;
    height: 3px;
    background: white;
    border-radius: 50%;
}


/* RESPONSIVO */

@media(max-width:900px){

.grid-vantagens{
grid-template-columns:repeat(2,1fr);
}

.grid-descubra{
grid-template-columns:1fr;
}

}

@media(max-width:700px){

.menu{
flex-direction:column;
gap:15px;
}

.grid-acomodacoes{
grid-template-columns:1fr;
}

.grid-footer{
grid-template-columns:1fr;
text-align:center;
}

.hero-texto h2{
font-size:30px;
}

}

/* BANNER INTERNO */

.banner-interno{
background:url("img/back_topo.png");	
/*background:#2c3e50;*/
color:white;
text-align:center;
padding:80px 20px;
}

.banner-interno h2{
	font-size:32px;
}



/* LISTA DE ACOMODAÇÕES */

.lista-acomodacoes{
padding:60px 0;
}

.acomodacao{
display:flex;
gap:40px;
margin-bottom:60px;
align-items:center;
}

.acomodacao img{
width:400px;
border-radius:10px;
}

.texto ul{
margin:15px 0;
}

.texto li{
margin-bottom:8px;
}


/* HAMBURGER */

.hamburger{
display:none;
font-size:28px;
cursor:pointer;
}


/* MENU RESPONSIVO */

@media(max-width:768px){

.hamburger{
display:block;
}

nav{
display:none;
width:100%;
}

nav.ativo{
display:block;
}

nav ul{
flex-direction:column;
gap:15px;
margin-top:20px;
}

.acomodacao{
flex-direction:column;
text-align:center;
}

.acomodacao img{
width:100%;
}

}

/* SLIDER */

.hero-slider{
position:relative;
height:420px;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.slides{
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
}

.slide{
position:absolute;
width:100%;
height:100%;
background-size:cover;
background-position:center;
opacity:0;
transition:opacity 1.5s ease;
}

.slide.active{
opacity:1;
}

.hero-texto{
position:relative;
z-index:2;

padding:20px 30px;
border-radius:8px;
}

.hero-texto h2{
font-size:42px;
margin-bottom:10px;
}

.hero-texto p{
margin-bottom:20px;
}

@media(max-width:768px){

.hero-slider{
height:320px;
}

.hero-texto h2{
font-size:26px;
}

}

.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 20px;
    right: 20px;
    
    border-radius: 50%;
    text-align: center;
    
    z-index: 1000;
    transition: transform 0.3s ease;
}

.whatsapp-float:hover {
    transform: scale(1.1);
}

.whatsapp-float img {
    width: 60px;
    margin-top: 10px;
}

/* GALERIA */
.galeria {
    padding: 60px 20px;
    text-align: center;
}

.grid-galeria {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    max-width: 1100px;
    margin: auto;
}

.grid-galeria img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    border-radius: 12px;
    cursor: pointer;
    transition: 0.4s;
}

.grid-galeria img:hover {
    transform: scale(1.07);
    filter: brightness(1.1);
}

/* LIGHTBOX PREMIUM */
#lightbox {
    display: none;
    position: fixed;
    z-index: 9999;
    padding-top: 40px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.95);
    animation: fadeIn 0.4s;
}

#lightbox img {
    margin: auto;
    display: block;
    max-width: 85%;
    max-height: 85%;
    border-radius: 12px;
    animation: zoomIn 0.4s;
}

/* BOTÃO FECHAR */
.fechar {
    position: absolute;
    top: 20px;
    right: 35px;
    color: #fff;
    font-size: 35px;
    cursor: pointer;
}

/* SETAS */
.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    color: white;
    font-size: 40px;
    padding: 16px;
    user-select: none;
    transform: translateY(-50%);
}

.prev { left: 10px; }
.next { right: 10px; }

.prev:hover, .next:hover {
    color: #ccc;
}

/* ANIMAÇÕES */
@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes zoomIn {
    from {transform: scale(0.8);}
    to {transform: scale(1);}
}

/* RESPONSIVO */
@media(max-width: 768px){
    .grid-galeria {
        grid-template-columns: 1fr;
    }
}