@import url('https://fonts.googleapis.com/css2?family=Lexend+Giga:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Abel&family=Lexend+Giga:wght@100..900&family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Abel&family=Cabin+Sketch:wght@400;700&family=Indie+Flower&family=Lexend+Giga:wght@100..900&family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Abel&family=Bebas+Neue&family=Cabin+Sketch:wght@400;700&family=Indie+Flower&family=Lexend+Giga:wght@100..900&family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap');

body{
    padding-top: 80px;
    margin: 0;
    padding: 0;
    color: #242424;
    font-family: sans-serif;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

h1,h2,h3,h4,h5,h6{
    font-family: 'Cabin Sketch', 'Lexend Giga', sans-serif;
    font-weight: 900;
    color: #000;
}

/* Estilo da navbar */

nav img{
    border-radius: 50%;
    width: 45%;
    height: 45%;
}

.nav-link{
    font-size: 20px;
    color: white;
}

.dropdown-menu{
    background-color: rgba(0, 0, 0, 0.164) !important;
}

.dropdown-menu a{
    color: white;
}

.dropdown-item:hover{
    background-color: rgba(0, 0, 0, 0.075) !important;
}

#navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1030; 
    transition: top 0.9s; 
}

nav a{
    font-family: Lexend Giga;
    font-size: 20px;
    color: rgb(223, 223, 223);
}

/* fim estilo da navbar */

iframe{
    padding: 60px;
}

.telefone{
    text-decoration: none;
    color: white;
}

.efeito-iframe-maps{
    padding: 5px;
}

.img-proximos{
    width: 100%;
    height: auto;
}

.google-calendar {
    position: relative; 
    z-index: 10; 
}

.calendar-container{
    padding: 90px;
}

/* Estilos dos efeitos do ScrollReveal */
.efeito-logo, .efeito-subtitle, .efeito-texto, .efeito-title, .slider-a, .efeito-subtitle-localization,
.efeito-title-agenda, .efeito-iframe-maps, .img-proximos, .c, .efeito-imagem01, .efeito-imagem02, .efeito-subtitle-quemsomos,
.efeito-texto01, .efeito-title-galery, .galery, .efeito-texto-mobile, .efeito-texto-desktop, .image-contatos,
.image-about, .sobre-texto, .contatos-texto, .efeito-subtitle2, .efeito-texto-informacoes, .sobre-imagem {               
    visibility: hidden;
}

.nav-link:hover{
    color: #e69232;
    transition: 0.6s;
}

.dropdown-item:hover{
    color: #e69232;
    transition: 0.6s;
}

.wrapper{
    width: 100%;
    margin: 0 auto;
    padding: auto;
}

main{
    display: block;
    background-color: white;
}

footer{
    background-color: #000000;
    color: white;
    text-align: center;
    padding: 20px 0;
    font-size: small;
}

.container{
    width: 100%;
    max-width: 780px;
    margin: 0 auto;
    padding: 0 20px;
}

.container.galery{
    max-width: 1100px;
}

.efeito-title-galery{
    font-family: Bebas Neue;
}

.efeito-texto{
    font-size: 20px;
}

.efeito-texto-mobile{
    display: none;
}

.efeito-texto-informacoes{
    font-size: 20px;
}

@media screen and (max-width: 768px) {
    .efeito-texto-mobile {
        display: none;
    }
}

.custom-modal-size {
    max-width: 90%; 
    width: 90%; 
}

.custom-modal-size .modal-dialog {
    max-width: none; 
    width: 100%; 
}

.modal-title{
    font-size: 30px;
}

@media screen and (max-width: 768px) {
    .efeito-texto-mobile{
        display: block;
    }
}

@media screen and (max-width: 768px) {
    .efeito-texto-desktop{
        display: none;
    }
}

@media (min-width: 900px){
    .container.container-01{
        display: flex;
        max-width: 1200px;
        gap: 3em;
    }
}

section .box img{
    width: 400px;
    height: auto;
}

@media (max-width: 900px){
    section .box img{
        width: 300px;
        height: auto;
    }
}

section .box{
    display: flex;
}

.container.container-02.about02, .container.contatos{    /* CSS para aumentar o tamanhao da seção */
    max-width: 1500px;
}

.img-proximos{
    border-radius: 25px;
}

/* Estilo para a seção de informações sobre o local */

.sobre-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    margin: 40px auto;
}

.efeito-subtitle2{
    padding: 30px;
}

.efeito-subtitle{
    padding: 20px;
}

.sobre-imagem {
    width: 50%;
}

.sobre-imagem img {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.sobre-info2 {
    width: 55%;
    text-align: left;
}

/* Ajuste para telas menores */
@media (max-width: 768px) {
    .sobre-container {
        flex-direction: column;
        text-align: center;
    }
    
    .sobre-imagem, .sobre-info2 {
        width: 100%;
    }
}

/* Fim do Estilo para a seção de informações sobre o local */

/* CSS para a seção do sobre a G14 */

.container-02 {
    display: flex;
    align-items: stretch;
    border-radius: 12px;
    overflow: hidden;
    width: 100%;
}

.sobre-info {
    width: 50%;
    padding: 30px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sobre-image {
    position: relative;
    width: 50%;
    height: auto;
    margin: 0;
    padding: 0;
}

.sobre-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 12px;
}

.sobre-texto {
    font-family: Bebas Neue;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 38px;
    font-weight: bold;
    text-align: center;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) {
    .container-02 {
        flex-direction: column;
    }
    .sobre-info, .sobre-image {
        width: 100%;
        padding: 0;
    }
    .sobre-image img {
        height: 250px;
    }
    .sobre-texto {
        font-size: 25px;
    }
}

/* Fim do CSS para a seção do sobre da G14 */

/* CSS para a seção de contatos da G14 */

@media (min-width: 900px){
    .container.container-02{
        display: flex;
        max-width: 1200px;
        gap: 3em;
    }
}

section .box-about img{
    width: 700px;
    height: auto;
}

@media (max-width: 900px){
    section .box-about img{
        width: 100%;
        padding-bottom: 20px;
    }
}

section .box-about{
    display: flex;
}

.contatos-imagem{
    width: 25px;
    height: 25px;
    vertical-align: middle;
    font-weight: bold;
}


.contatos-container {
    display: flex;
    align-items: stretch;
    gap: 0;
    border-radius: 12px;
    overflow: hidden;
}

.contatos-image {
    position: relative;
    width: 50%;
    height: auto;
}

.contatos-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    filter: brightness(70%);
}

.contatos-texto {
    font-family: Bebas Neue;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 38px;
    font-weight: bold;
    text-align: center;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.contatos-info {
    width: 50%;
    padding: 30px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.contatos-info h2 {
    font-family: Lexend Giga;
    font-weight: 700;
    color: #000000;
}

.efeito-texto01 {
    font-size: 20px;
    line-height: 1.6;
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 768px) {
    .contatos-container {
        flex-direction: column;
    }
    .contatos-image, .contatos-info {
        width: 100%;
    }
    .contatos-image img {
        height: 250px;
    }
    .contatos-texto {
        font-size: 25px;
    }
}

/* Fim do CSS para a seção de contatos da G14 */


/* Estilo para as seções e efeito prallax */

section.module:last-child{
    margin-bottom: 0;
}

section.module.parallax .container{
    width: 100%;
}

section.module.parallax .container img{
    margin: 0 auto;
    width: 100%;
    height: 100%;
}

section.module.parallax h1{
    font-family: Cabin Sketch;
    color: white;
    text-align: center;
    font-size: 80px;
    z-index: 50;
    text-transform: uppercase;
    padding: 30px;
}

@media (max-width: 900px){
    section.module.parallax h1{
        color: white;
        text-align: center;
        font-size: 35px;
        z-index: 50;
        text-transform: uppercase;
    }
}

section.module h2{
    font-family: Bebas Neue;
    font-weight: bold;
    margin-bottom: 40px;
    font-size: 40px;
}

@media (max-width: 900px){
    section.module h2{
        margin-bottom: 40px;
        font-size: 35px;
    }
}

section.module.content{
    padding: 40px 0;
    background: #e69232;
}

.localImg{
    width: 60px;
    height: 60px;
}

section.module.parallax{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100vh !important;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;

    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

@media (max-width: 768px) {
    section.module.parallax {
        background-attachment: scroll;
        background-position: center top;
        background-size: cover;
    }
}

section.module.parallax:after{
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 8;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,0) 40%, #000000be 100%);
    background: -moz-linear-gradient(to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,0) 40%, #000000be 100%);
    background: -webkit-linear-gradient(to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,0) 40%, #000000be 100%);;
}  

section.module.parallax-1 {
    background-image: url(../img/dek03.jpg);
    position: relative;
    overflow: hidden;
}

section.module.parallax-1::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* mantém a imagem de fundo original */
    filter: brightness(65%); /* Aplica o filtro de brilho */
    z-index: 1; /* Coloca a camada de filtro atrás do conteúdo */
}

section.module.parallax-1 .efeito-logo {
    position: relative;
    z-index: 2; /* Garante que as imagens internas fiquem acima do filtro */
}

section.module.parallax-2 {
    background-image: url(../img/patio-entrada.jpg);
    position: relative;
    overflow: hidden;
}

section.module.parallax-2::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* mantém a imagem de fundo original */
    filter: brightness(65%); /* Aplica o filtro de brilho */
    z-index: 1; /* Coloca a camada de filtro atrás do conteúdo */
}

section.module.parallax-2 h1 {
    position: relative;
    z-index: 2; /* Garante que as imagens internas fiquem acima do filtro */
}

section.module.parallax-3 {
    background-image: url(../img/bar02.jpg);
    position: relative;
    overflow: hidden;
}

section.module.parallax-3::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* mantém a imagem de fundo original */
    filter: brightness(65%); /* Aplica o filtro de brilho */
    z-index: 1; /* Coloca a camada de filtro atrás do conteúdo */
}

section.module.parallax-3 h1 {
    position: relative;
    z-index: 2; /* Garante que as imagens internas fiquem acima do filtro */
}

section.module.parallax-4 {
    background-image: url(../img/dek.jpg);
    position: relative;
    overflow: hidden;
}

section.module.parallax-4::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* mantém a imagem de fundo original */
    filter: brightness(65%); /* Aplica o filtro de brilho */
    z-index: 1; /* Coloca a camada de filtro atrás do conteúdo */
}

section.module.parallax-4 h1 {
    position: relative;
    z-index: 2; /* Garante que as imagens internas fiquem acima do filtro */
}

section.module.parallax-5 {
    background-image: url(../img/imagem-cadeiras-garagem.jpg);
    position: relative;
    overflow: hidden;
}

section.module.parallax-5::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* mantém a imagem de fundo original */
    filter: brightness(65%); /* Aplica o filtro de brilho */
    z-index: 1; /* Coloca a camada de filtro atrás do conteúdo */
}

section.module.parallax-5 iframe, h1 {
    position: relative;
    z-index: 2; /* Garante que as imagens internas fiquem acima do filtro */
}



/* FIM Estilo para as seções e efeito prallax */