
@media screen and (max-width: 1950px){

    
}

@media screen and (max-width: 1760px) and (min-width: 1350px){
    .sobrenos__sec > p, .produtos__sec__content > p {
        margin: 2% 0 10% 0;
        font-size: 1.5rem !important;
    }

    .sobrenos__sec > p{
        margin: 2% 15% 10% 0px !important;
    }

    
}

@media screen and (max-width: 1350px) and (min-width: 1250px){

    .sobrenos__sec > *{
        padding-left: 10% !important;
    }

    .sobrenos__sec > p, .produtos__sec__content > p {
        margin: 2% 0 10% 0;
        font-size: 1.3rem !important;
    }



    .button{
        font-size: 1.2rem !important;
    }

    .sobrenos__sec > p{
        margin: 2% 25% 5% 0px !important;
    }
    

}

@media screen and (max-width: 1250px) and (min-width: 1025px){
    .sobrenos__sec > *{
        padding-left: 10% !important;
    }

    .sobrenos__sec > p, .produtos__sec__content > p {
        margin: 2% 0 10% 0;
        font-size: 1rem !important;
    }

    .button{
        font-size: 1.2rem !important;
    }

    .sobrenos__sec > p{
        margin: 2% 35% 5% 0px !important;
    }
    
}

@media (max-width: 1025px){
    .inicio__container__content{
        justify-content:center !important;
        border-right: none !important;
        margin-left: 0px !important;
    }

    .inicio__container__content > p{
        width: 100% !important;
        text-align: center !important;
    }

    #sobrenos{
        display: initial !important;
        height: auto !important;

    }

    #sobrenos > *{
        text-align: center;
    }

    .sobrenos__sec__bt{
        display: flex !important;
        justify-content: center !important;
    }
    
    #produtos{
        display: initial !important;
        height: auto !important;
    }

    .produtos__firs{
        display: none !important;
    }
    

    .produtos__sec__content > *{
        text-align: center !important;
    }

    .produtos__sec__bt{
        justify-content: center !important;
    }

    .content__datas{
        flex-direction: column !important;
        margin-bottom: 3% !important;
    }

}

#inicio{
    background-image: url('../img/bg/madeira-cat.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    height: 75vh;
    display: flex;
    justify-content: end;
    flex-direction: column;
}

.inicio__content{
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 83%);
}

.inicio__background{
    max-width: 100%;
    max-height: 50vh;
    bottom: 0;
    left: 0;
    margin: auto;
    overflow: auto;
    right: 0;
    top: 0;
    -o-object-fit: contain;
    object-fit: contain;
}

.inicio__container__content{
    display: flex;
    justify-content: end;
    width: 100%;
    border-right: 3px solid white;
    margin-left: -10%;
}

.inicio__container__content > p{
    font-size: 35px;
  width: 40%;
  color: white;
  padding-bottom: 117px;
  padding-right: 2%;
  text-align: end;
}


#sobrenos {
    display: flex;
    flex-direction: row;
    height: 75vh;
}

#sobrenos > *{
    width: 100%;
}

.sobrenos__firs{
    width: 100%;
    height: 100%;
}

.sobrenos__mid{
    width: 100%;
    height: 100%;
    object-fit: cover; 
}

.sobrenos__sec{
    width: 100%;
}

.sobrenos__sec > * {
    padding: 3%;
}

.sobrenos__sec > h2{
    font-size: 3rem;
    color: #035024;
}

.sobrenos__sec > p{
    margin: 2% 10% 10% 0px;
    font-size: 2rem;
}

.button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 200px;
    height: 50px;
    padding: 0 20px;
    /*background: linear-gradient(90deg, #f0f0f0, #d4d4d4); /* Gradiente do botão */
    border: none;
    border-radius: 30px;
    cursor: pointer;
    font-family: Arial, sans-serif;
    font-size: 1.5rem;
    color: #000;
    text-decoration: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.button span {
    margin-right: 10px;
}

.button::after {
    content: ">"; /* Seta para a direita */
    font-size: 1.5rem;
}

#produtos{
    display: flex;
    flex-direction: row-reverse;
    height: 65vh;
}

.produtos__firs{
    width: 100%;
    height: 100%;
}

.produtos__sec{
    width: 100%;
}

.produtos__sec__content{
    padding: 10%;

}

.produtos__sec__content > * {
    text-align: right;

}

.produtos__sec__content > h2 {
    font-size: 3rem;
}


.produtos__sec__content > p {
    font-size: 2rem;
    padding: 5% 0 10% 0;
}

.produtos__sec__bt{
    display: flex;
    justify-content: end;
}

#materiais{
    background-color: #A4DF60;
}



.content > h2{
    text-align: center;
    font-size: 55px;
    margin-bottom: 3%;
    padding-top: 5%;
    color: #035024;
}

.content__datas{
    display: flex;
    justify-content: center;
    text-align: center;
}


.content__datas > *{
    margin: 3%;
    font-size: 30px;
}

.content__datas > div > *{
    margin: 3%;
}

/* Estilos de animação para as seções */
.sobrenos__firs, .sobrenos__sec {
    opacity: 0;
    transition: transform 1s ease-out, opacity 1s ease-out;
}

.sobrenos__firs {
    transform: translateX(-100%); /* Começa fora da tela, à esquerda */
}

.sobrenos__sec {
    transform: translateX(100%); /* Começa fora da tela, à direita */
}

.sobrenos__firs.show, .sobrenos__sec.show {
    opacity: 1;
    transform: translateX(0); /* Move para a posição original */
}

/* Animação de deslizamento para a seção de produtos */
.produtos__firs, .produtos__sec {
    opacity: 0;
    transition: transform 1s ease-out, opacity 1s ease-out;
}

.produtos__firs {
    transform: translateX(-100%); /* Começa fora da tela, à esquerda */
}

.produtos__sec {
    transform: translateX(100%); /* Começa fora da tela, à direita */
}

.produtos__firs.show, .produtos__sec.show {
    opacity: 1;
    transform: translateX(0); /* Move para a posição original */
}


#materiais .content, #diferenciais .content {
    opacity: 0;
    transform: translateY(100%); /* Começa fora da tela, na parte de baixo */
    transition: transform 1s ease-out, opacity 1s ease-out;
}

#materiais .content.show, #diferenciais .content.show {
    opacity: 1;
    transform: translateY(0); /* Move para a posição original */
}

/* Animação para os itens dentro de content__datas */
.content__datas > div {
    opacity: 0;
    transform: translateY(50px); /* Começa levemente abaixo */
    transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}

.content__datas > div.show-item {
    opacity: 1;
    transform: translateY(0); /* Move para a posição original */
}

.blue_ocean{
    background-color: #44CDD9;
}