body {
            font-family: 'Roboto', Arial, sans-serif;
            font-weight: 400;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 1rem;
        }
        .topo video {
            width: 100%;
            height: auto;
            max-width: 500px;
            border-radius: 10px;
        }
        .imagem {
            transition: transform 0.2s ease;
            cursor: pointer;
        }
        .imagem.ampliada {
            transform: scale(1.9);
            z-index: 999;
        }
        @media (max-width: 767px) {
            .topo-container, .galeria, .servicos {
                padding: 1rem;
            }
            .frase {
                font-size: 1rem;
                line-height: 1.4;
            }
            .fixed-btn {
                width: 40px;
                height: 40px;
                font-size: 18px;
            }
        }

/* Botões Fixos */
.fixed-buttons {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 1000;
}

.fixed-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: #25d366; /* Cor do botão WhatsApp */
    color: white;
    border-radius: 50%;
    text-decoration: none;
    font-size: 24px;
}

.instagram-fixed {
    background-color: #e1306c; /* Cor do botão Instagram */
}
.download-fixed {
    background-color: #4169E1; /* Cor do botão Download */
}
.fixed-btn i {
    margin: 0;
}

.dwn-btn {
    display: inline-flex;
    align-items: center;
    background-color: #4169E1;
    color: white;
    padding: 1rem 2rem;
    text-decoration: none;
    border-radius: 5px;
    margin: 2rem 0;
    font-size: 1rem;
}
.dwn-btn i {margin-right: 0.5rem;}

/* Primeira Parte */
.topo {
    color: white;
    text-align: center;
    padding: 2rem;
    position: relative;
    background: #0000CD;
}

.topo-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem 15rem;
    position: relative;
    z-index: 1;
}

.topo h1 {
    text-align: left;
    margin-bottom: 1rem;
    font-size: 2rem;
    color: #FFF;
}

.esquerda {
    margin-right: 3rem;
    margin-bottom: 1rem;
}

.logo {
    width: 200px;
    margin-bottom: 1rem;
}

.frase {
    font-size: 1.5rem;
    font-weight: lighter;
    margin-bottom: 1rem;
}

.whatsapp-btn {
    display: inline-flex;
    align-items: center;
    background-color: #25d366;
    color: white;
    padding: 1rem 2rem;
    text-decoration: none;
    border-radius: 5px;
    margin: 1rem 0;
    font-size: 1rem;
}

.whatsapp-btn i {
    margin-right: 0.5rem;
}

.direita {
    display: grid;
    grid-template-columns: 1fr 0fr;
    gap: 0.1rem;
    text-align: left;
}

.topo video {
     margin: -0px;
     width: 500px;
     height: 400px;
     border-radius: 10px;
       
}


/*.direita img {
    width: 250px;
    border-radius: 10px;
}*/

/* Segunda Parte */
.servicos {
    background-color: white;
    padding: 5rem 10rem;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.box {
    text-align: center;
    width: 30%;
    margin-bottom: 1rem;
}

.box h2 {
    margin-bottom: 2rem;
    font-size: 1.5rem;
    color: #0000CD;
}

.box i {
    font-size: 3rem;
    color: #0000CD;
}

.box p {
    font-size: 1.2rem;
}

/* Terceira Parte */
.galeria {
    background-color: #0000CD;
    color: white;
    text-align: center;
    padding: 5rem 10rem;
}

.galeria h2 {
    margin-bottom: 1rem;
    font-size: 2rem;
    color: #FFF;
}

.galeria h3 {
    margin-bottom: 3rem;
    font-size: 1.5rem;
    font-family: 'Roboto';
    font-weight:lighter; 
    color: #FFF;
    padding: 0rem 10rem;
}

.galeria .imagens-galeria {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 3rem;
}

.galeria .imagens-galeria img {
    width: 220px;
    margin: 0.2rem;
    border-radius: 10px;
}

/* Ampliar a imagem */
 .imagem {
            width: 220px; /* largura inicial da imagem */
            transition: transform 0.2s ease; /* animação suave */
            cursor: pointer; /* cursor indica que é clicável */
        }

        .imagem.ampliada {
            transform: scale(1.9); /* aumenta a escala da imagem para 150% */
        }

/* Nossos Clientes */
.clientes {
    background-color: white;
    text-align: center;
    padding: 2rem 1rem;
}

.clientes h2 {
    color: #0000CD;
    font-size: 2rem;
    margin-bottom: 1rem;
}

.clientes h3 {
    margin-bottom: 2rem;
    font-size: 1.5rem;
    font-weight: lighter;
    color: #696969;
}

.clientes-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

.clientes-logos img {
    width: 100px;
    border-radius: 5px;
}

/* Quarta Parte */
.contatos {
    background-color: #0000CD;
    text-align: center;
    padding: 2rem;
}

.contato-item {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.07rem;
}

.contato-item i {
    margin-right: 0.5rem;
    color: #fff;
    font-size: 1.5rem;
}

.contato-item h3 {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 1.2rem;
    color: #fff;
    margin: 10px 0px;
}

.mapa iframe {
    width: 100%;
    height: 400px;
    border: 0;
}

.assinatura {
    text-align: center;
    font-size: 0.7rem;
    padding: 1rem;
}

.assinatura img {
    width: 10rem;
}
.assinatura p {
    text-align: center;
    font-size: 0.7rem;
    padding: 1rem;
    color: #696969;
}

.assinatura a {
    text-decoration: none;
    color: #696969;
}

/* Responsividade */
@media (min-width: 768px) {
    .topo-container {
        flex-direction: row;
        justify-content: space-between;
    }

    .esquerda {
        text-align: left;
    }

    .direita {
        margin-left: 2rem;
    }
}

@media (max-width: 767px) {
    .logo {
        width: 220px;
    }
    .topo-container {
        margin: 0;
        flex-direction: column;
        padding: 0rem;
    }

    .topo h1 {
        text-align: left;
        margin-bottom: 1rem;
        font-size: 2rem;
        color: #FFF;
    }
    
    .frase {
        text-align: left;
        font-size: 1.3rem;
        margin-bottom: 2rem;
    }

    .whatsapp-btn {
        margin-bottom: 3rem;
    }
    
    .esquerda {
    margin-right: 0rem;
    }
    
    /*.direita img {
        width: 150px;
    }*/

    .direita {
        width: 100%;
        padding: 0;
        grid-template-columns: 1fr 0fr;
    }
    
    .direita video {
        width: 100%;
    }

    .servicos {
        padding: 1rem;
    }

    .galeria .imagens-galeria img {
        width: 150px;
    }

    .box {
        width: 80%;
    }

    .clientes-logos img {
        width: 100px;
        border-radius: 5px;
    }

    .contato-item {
        align-items: left;
        justify-content: left;
        text-align: left;
        margin-bottom: 0.05rem;
    }
    .galeria {
    padding: 2rem 1rem;
    }
    
    .galeria h2 {font-size: 1.3rem;}
    .galeria h3 {font-size: 1.2rem; padding: 0rem 1rem;}
    .box h2 {font-size: 1.3rem;}
    .clientes h2 {font-size: 1.3rem;}
    .clientes h3 {font-size: 1.2rem;}
}