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

body{
background:#f5f5f5;
}

/* HEADER */
header{
position:fixed;
top:0;
width:100%;
background:#111;
color:white;
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 40px;
z-index:1000;
}

.logo img{
height:50px;
}

nav a{
color:white;
margin:0 10px;
text-decoration:none;
}

.topo-direita{
display:flex;
gap:10px;
align-items:center;
}

/* 🔥 BOTÃO LIGAR AGORA NO TOPO */
.ligar-topo{
background:#007BFF;
border-radius:5px;
color:white;
text-decoration:none;
}

/* WHATSAPP TOPO */
.whatsapp-topo{
background:#25D366;
border-radius:5px;
color:white;
text-decoration:none;
}

/*INSTAGRAM TOPO*/
.instagram-topo {
    background: #E1306C;
    color: white;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: 0.3s;
}

.instagram-topo:hover {
    background: #E1306C;
    color: white;
}

.topo-direita a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1; /* 🔥 ESSA LINHA resolve tudo */
    height: 45px;
    border-radius: 5px;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap;
}

.topo-direita a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 170px; /* aumenta um pouco pra caber "Ligar Agora" */
    height: 45px;
    border-radius: 5px;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap; /* 🔥 impede quebra de linha */
}

/* HERO */
.hero{
min-height:110vh;
display:flex;
align-items:flex-end; 
justify-content:center;
text-align:center;
color:white;

padding:120px 20px 60px;

background-image:
linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)),
url("../imagem/fundo.png");

background-size: cover;
background-position: center 0%;
background-repeat:no-repeat;
}

/* REMOVE BOTÕES DO HERO */
.hero-contato{
display:none;
}

/* BOTÕES */
.btn-whatsapp{
background:#25D366;
padding:15px 25px;
color:white;
border-radius:5px;
text-decoration:none;
}

.btn-ligar{
background:#007BFF;
padding:15px 25px;
color:white;
border-radius:5px;
text-decoration:none;
}

/* SERVIÇOS */
.servicos{
padding:80px 20px;
text-align:center;
}

.servicos-grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:25px;

max-width:1100px;   
margin:auto;        
}

.servico{
background:white;
padding:30px;
border-radius:12px;
width:300px;
}

/* SOBRE */
.sobre{
padding:120px 20px;
background:white;
text-align:center; /* 👈 CENTRALIZA */
}

.container-sobre{
max-width:800px;
margin:auto;
}

.sobre p{
margin-bottom:10px;
}

/* 👇 ALINHAR BOTÕES DO SOBRE */
.sobre-contato{
margin-top:20px;
display:flex;
justify-content:center;
gap:15px;
flex-wrap:wrap;
}

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

.galeria img{
width:100%;
height:250px;
object-fit:cover;
border-radius:12px;
}

/* CONTATO */
.contato{
padding:80px 20px;
background:#111;
color:white;
text-align:center;
}

form{
max-width:500px;
margin:auto;
display:flex;
flex-direction:column;
gap:15px;
}

input, textarea{
padding:12px;
border:none;
border-radius:5px;
}

button{
background:#25D366;
color:white;
padding:15px;
border:none;
border-radius:5px;
}

/* WHATSAPP FIXO */
.whatsapp-fixo{
position:fixed;
bottom:20px;
right:20px;
background:#25D366;
padding:15px;
border-radius:50px;
color:white;
text-decoration:none;
}

/* MOBILE */
@media(max-width:768px){

header{
flex-direction:column;
padding:10px;
position:relative;
}

.hero{
padding:40px 10px;
min-height: 55vh;
background-size: 180%;
background-position: center 20%;
}

.topo-direita{
flex-direction:column;
width:100%;
}

.ligar-topo, .whatsapp-topo, .instagram-topo {
    width:100%;
    text-align:center;
}

.sobre-contato{
flex-direction:column;
}

.btn-ligar, .btn-whatsapp{
width:100%;
text-align:center;
}

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

.servico{
width:100%;
}

}

/* TITULOS */
.servicos h2,
.trabalhos h2,
.sobre h2{
text-align:center;
margin-bottom:40px;
}

/* TRABALHOS */
.trabalhos{
padding:100px 20px;
text-align:center;
}