*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, sans-serif;
}


body{
color:#222;
}


header{

height:80px;
display:flex;
align-items:center;
justify-content:space-around;
padding:15px 5%;

background:white;

}


.logo{

width:230px;

}



nav a{

margin:0 15px;
text-decoration:none;
color:#222;

}



.boton{

background:#c88b00;
color:white;
padding:15px 25px;
border-radius:30px;
text-decoration:none;

}



.hero{

height:600px;

background:

linear-gradient(
90deg,
rgba(0,0,0,.6),
rgba(0,0,0,.1)
),

url("imagenes/fachaleta de piedra beige instalada2.png");


background-size:cover;
background-position:center;


display:flex;
align-items:center;

}



.texto{

color:white;
padding-left:8%;

}



.texto h1{

font-size:70px;

}


.texto span{

color:#d99a00;

}



section{

padding:70px 8%;

}



h2{

text-align:center;
font-size:40px;
margin-bottom:40px;

}



.cards{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}



.card{

box-shadow:0 5px 20px #ddd;
background:white;

}



.card img{

width:100%;
height:250px;
object-fit:cover;

}



.card h3,
.card p{

padding:15px;

}



.galeria{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}



.galeria img{

width:100%;
height:300px;
object-fit:cover;

}



.beneficios{

display:grid;

grid-template-columns:repeat(4,1fr);

text-align:center;

}



.contacto{

background:#222;
color:white;
text-align:center;

}


.contacto a{

display:inline-block;

margin-top:20px;

padding:15px 30px;

background:#25d366;

color:white;

border-radius:30px;

text-decoration:none;

}



footer{

background:#111;
color:white;
padding:30px;
text-align:center;

}



footer img{

width:200px;

}

/* BOTON FLOTANTE WHATSAPP */

.whatsapp-float {

position: fixed;

width: 65px;
height: 65px;

bottom: 25px;
right: 25px;

background-color: #25D366;

border-radius: 50%;

display:flex;
align-items:center;
justify-content:center;

box-shadow:0 4px 15px rgba(0,0,0,0.3);

z-index:999;

transition:0.3s;

}


.whatsapp-float:hover{

transform:scale(1.1);

}



.whatsapp-float img{

width:38px;
height:38px;

}