/*CORES PADRÕES*/
:root{
    --bg-body: #182C48;
    --hover: #FFC900;
    --titles: #ffff; 
    --subtitle: #ffff;
    --subtitle-line: #FFC900;
    --lines: #FFC900;
}

/** CONFIGURAÇÕES PRINCIPAIS **/
html {
  scroll-behavior: smooth;
}

body{
    padding: 120px 0 0 0 ;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    background: var(--bg-body);
}

/* Remove fundo cinza ao tocar em links e botões no iOS */
* {
  -webkit-tap-highlight-color: transparent;
}
a:active, button:active {
    background-color: transparent;
    -webkit-tap-highlight-color: transparent;
}

/* Menu mobile: padrão escondido */
.nav-mobile {
    width: 100%; 
    max-height: 0;
    overflow: hidden;
    background-color: #182C48;
    position: absolute;
    top: 60px;
    right: 0;
    transition: max-height 0.3s ease;
    z-index: 1000;
}

/* Lista dentro do menu */
.nav-mobile ul {
    text-align: center;
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-mobile li a {
    color: white;
    text-decoration: none;
    padding: 10px 15px;
    display: block;
    font-size: 15px;
}

.nav-mobile li a:hover {
    color: #ffc800;
}

/* Botão mobile */
.menu-toggle {
    display: flex;
    justify-content: center; 
    align-items: center;     
    width: 40px;
    height: 40px;
    font-size: 22px;
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;              
    user-select: none;
    line-height: 1; 
    padding: 0;   
    text-align: center;
}


/* Exibir e animar o menu mobile */
.nav-mobile.active {
    max-height: 1000px;
    opacity: 1;
    pointer-events: auto;
}

/* Fundo preto transparente */
.nav-overlay {
    position: fixed;
    top: 60px;                 
    left: 0;
    width: 100%;
    height: calc(100% - 60px); 
    background: rgba(0,0,0,0.6);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
    z-index: 900;
}

.nav-overlay.active { display: block;  opacity: 1; visibility: visible;}

/* direcionamento de link */
.link-direct{text-decoration: none; color: #fff;}
/*----------------------------*/




/*Conf das Linhas com Texto*/
.line-text {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--subtitle-line); 
    font-size: 28px;
    font-weight: bold;
    text-transform: uppercase;
    z-index: 2;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
}

/*Linha a Esquerda*/
#lf{
    flex: 1;
    border: none;
    width: 200px;
    height: 5px;
    background-color: var(--lines);
    margin-right: 15px;
}
/*Linha a Direita*/
#lr{
    flex: 1;
    border: none;
    width: 200px;
    height: 5px;
    background-color: var(--lines);
    margin-left: 15px;
}
/*----------------------------*/

/*TITULO PRINCIPAL*/
.title{
    color: var(--titles);
    text-align: center;
    text-transform: uppercase;
    font-size: 60px;
}

.palavra-wrapper {
  height: 1.2em;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  width: 10ch; 
}

.palavra-slide {
  height: 1.2em;
  line-height: 1.2em;
  align-items: center;
  white-space: nowrap;
  display: flex;
  flex-direction: column;
  transition: transform 0.6s ease-in-out;
}

.palavra-slide span {
  height: 1.2em;
  display: flex;      
  align-items: center; 
  white-space: nowrap; 
}

.section-objectives h1 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
}
/************************************/

/*CONTAINER DA BARRA DE NEVEGAÇÃO*/
.ctn-header{
    position: fixed; 
    top: 0;
    left: 0;
    width: 100%;
    height: 120px;
    display: flex;
    justify-content: space-evenly;
    gap: 58%;
    align-items: center;
    background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    background-color: #182C48; 
    z-index: 1100; 
}

/*Logo da Barra de Navegação*/
.logo a img{
    width:300px;
    height: auto;
}

/*Opções da Barra de Navegação*/
.nav ul{
    list-style: none;
    display: flex;
    margin: 0; 
    padding: 0;
    gap: 20px;    
}

.nav ul li {
    position: relative;
    padding-right: 15px; 
    border-right: 3px solid var(--hover); 
}

.nav ul li:last-child { border-right: none;}

.nav ul a{
    text-decoration: none;
    color: var(--subtitle);
    font-size: 21px;
    transition: 0.5s;
}

.nav ul li a:hover{color: var(--hover);}
/*----------------------------*/

/*CONTAINER SOBRE NÓS - EMPRESA*/
.ctn-sobre{
    width: 100%;
    height:720px;
    display: flex;
    justify-content: center;
    align-items: center; 
    background: url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat, url(../Imgs/Fundos/Fundo-sobre-empresa.png) top center;
    
}

/*Container da Logo e mensagem*/
.ctn-contents{
    width: 100%;
    margin-top: -90px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 20px;
}

/*Logo*/
.logo-sobre img{
   width: 600px;
   height: auto;
}

/*Mensagem*/
#msg-logo{
    width: 70%;
    text-align: justify;
    color: var(--subtitle);
    font-size: 33px;
    font-weight:600;
    text-indent: 1em;
}
/*----------------------------*/
/************************************/

/** OBJETIVOS DA EMPRESA **/
.section-objectives{
    justify-content: center;
    align-items: center;
}

/*Ajuste de Posição */
.align-ctn-obj{
    display: flex;
    justify-content: space-around;
    align-items: center;
}

/*Grid para os Cards*/
.grid-obj{
    display: flex;
    align-items: center;
    gap: 100px;
}

/*Cards*/
.card-obj{
    width: 452px;
    height: 209px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background: transparent;
}

/*Container de Textos*/
.ctn-texts-obj{
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    flex-direction: column;
}

/*Subtítulos de Objetivos*/
.title-obj{
    margin: 8px;
    text-transform: uppercase;
    color: var(--titles);
}

/*Descrição de Diferencias*/
.desc-obj{
    width: 100%;
    margin: 0;
    font-size:20px;
    color: var(--subtitle);
}

.ctn-texts-obj ul{
    color: var(--subtitle);
    margin: 0;
    text-align: start;
}
.ctn-texts-obj li{
    margin: 0;
    font-size:20px;
}
/************************************/

/*Linha Separadora dos Cards*/
.sep-obj{
    width: 5px;
    height: 200px;
    background: var(--lines);
}
/************************************/

/*CONTAINER DE VIDEO*/
.ctn-video{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 55px;
}

/*tamanhho do player*/
.ctn-video iframe{
    width: 978px;
    height: 550px;
     box-shadow: 0 0 8px 2px #ffc800;
}

/************************************/

/** FOOTER **/
footer{
    width: 100%;
    background: url(../Imgs/Footer/nuvem.png) center no-repeat;
    height:420px;
    border-top: 5px solid var(--lines);
    align-items: center;
    justify-content: center;
    display: flex;
}

.footer-cont{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.footer-info{
    width: 75%;
    height: 200px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 0px;
}

/*Card Footer*/
.card-info-f{
    width: 25%;
    height: 200px;
    align-items: center;
}

/*Titulo dos Cards*/
.title-footer{
    margin-bottom: 10px;
    text-align: center;
    text-transform: uppercase;
    font-size:25px;
    color: var(--titles);
}

/*CARD CONTATO*/
.card-info-f ul{
    padding: 0 0 0 80px;
    margin: 0;
    list-style: none;
    text-align: center;
}

.card-info-f li a{
    display: flex;
    align-items: center;
    margin-bottom: 5px;
    gap: 5px;
    font-size: 18px;
    transition: 0.3s;
}

.card-info-f li a:hover{
    color: var(--hover);
}
/*----------------------------*/

/*CARD AGREDECIMENTO NH*/
.card-info-f p{
    margin: 0;
    text-align: justify;
    color: var(--subtitle);
    font-size: 18px;
}    
 /*----------------------------*/   

/*CARD REDES SOCIAS*/
.ctn-sm{
    margin-top: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}
.ctn-sm a{list-style: none;transition: 0.3s;}
.ctn-sm a:hover{transform: scale(1.05);}
 /*----------------------------*/   

/*Descrição Final*/
.foo-descrition{
    width: 40%;
}

/*Copyright*/
.foo-descrition p{
    font-size: 15px;
    margin: 5px 0;
    text-align: center;
    color: var(--subtitle);
}

/*Direcionanto ao Dev*/
#developer {
    text-decoration: none;
    color: white;
    font-weight: bold;
    transition: 0.5s;
    display: inline-block; 
}
#developer:hover {text-decoration: underline;}
/************************************/

.line-text-mobile{display: none;}

.menu-toggle{display: none;}


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

    body {padding: 60px 0 0 0 ;}
    html, body {overflow-x: hidden;}

    /*Conf das Linhas com Texto*/
    .line-text-mobile {display: block;}
    .line-text {display: none;}

    .line-text-mobile {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--subtitle-line); 
    font-size: 28px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    z-index: 2;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
    }
    .line-text-mobile h2 {font-size: 28px;}
    /*----------------------------*/
    
    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        width: 100%;
        height: 60px;
        display: flex;
        justify-content:center;
        gap: 46%;
        background: url(../Imgs/Fundos/Fundo-header-mb.png) repeat-x;
    }

    .nav-overlay {top: 60px;}

    /*Logo da Barra de Navegação*/
    .logo a img {width:140px; height: auto;}

    /*Config da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}
    /*----------------------------*/   
    
    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 445px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 290px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
        
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -40px; gap: 0px;}

    /*Logo*/
    .logo-sobre img {width: 200px; height: auto;}

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 15px;
        font-weight:600;
        text-indent: 1em;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 26.5px;}

    .section-objectives h1 {display: flex; flex-direction: column;}

    /** OBJETIVOS DA EMPRESA **/

    /*Grid para os Cards*/
    .grid-obj {flex-direction: column; gap: 50px;}

    /*Cards*/
    .card-obj {width: 350px; height: 180px;}

    .card-obj img {width: 70px; height: auto;}

    #icon-valores {width: 95px; height: auto;}

    /*Container de Textos*/
    .ctn-texts-obj {
        display: flex;
        color: var(--titles);
        justify-content: center;
        text-align: center;
        align-items: center;
        flex-direction: column;
    }

    /*Subtítulos de Objetivos*/
    .title-obj {margin: 8px; text-transform: uppercase;}

    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }

    .ctn-texts-obj ul {margin: 0; text-align: start; padding: 0;}
    .ctn-texts-obj li {margin: 0; font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj {display: none;}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:95%; height: 209px;}
    /************************************/

    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-mobile.png) center no-repeat;
        background-size: 775px auto;
        height:auto;
    }

    .footer-cont {
        width: 100%;
        height: auto;
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: none;
        flex-direction: column;
    }
    .footer-info {
        width: 100%;
        flex-direction: column;
        height: auto;
        gap: 0px;
        align-items: flex-start; 
    }

    .card-info-f {
        margin: 0;
        width: 100%;
        height: auto;
        padding: 0 8px;
        text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }

    #icon-sol {width: 90px; height: auto;}

    .title-footer {font-size: 20px; text-align: left;}

    .card-info-f ul {padding: 10px 0px;}

    .card-info-f li a {justify-content: flex-start;font-size: 16px;}

    .card-info-f p {font-size: 16px; text-align: left;}

    .ctn-sm {gap: 15px; margin-top: 0px;}

    .ctn-sm a img {width: 45px; height: auto;}

    #icon-insta {width: 40px; height: auto;}

    .foo-descrition {width: 100%; text-align: center;}

    .foo-descrition p {font-size: 13px;text-align: center;}

    .p1 {order: 1;}
    .p2 {order: 2;}
    .p3 {order: 3;}
/************************************/
}
/*REPONSIVIDADE 541 até 766*/
@media (min-width: 541px) and (max-width: 766px) {

    body {padding: 60px 0 0 0 ;}
    html, body {overflow-x: hidden;}

    /*Conf das Linhas com Texto*/
    .line-text-mobile {display: block;}
    .line-text {display: none;}

    .line-text-mobile {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--subtitle-line); 
    font-size: 28px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    z-index: 2;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
    }
    .line-text-mobile h2 {font-size: 28px;}
    /*----------------------------*/
    
    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        width: 100%;
        height: 60px;
        display: flex;
        justify-content:center;
        gap: 58%;
        background: url(../Imgs/Fundos/Fundo-header-mb.png) repeat-x;
    }

    .nav-overlay {top: 60px;}

    /*Logo da Barra de Navegação*/
    .logo a img {width:150px; height: auto;}

    /*Config da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}
    /*----------------------------*/   
    
    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 445px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 290px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -40px;gap: 0px;}

    /*Logo*/
    .logo-sobre img {width: 240px;height: auto;}

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 16px;
        font-weight:600;
        text-indent: 1em;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 38px;}

    .section-objectives h1 {display: flex;flex-direction: column;}

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {flex-direction: column;gap: 50px;}

    /*Cards*/
    .card-obj {width:380px;height: 180px;}

    .card-obj img {width: 70px;height: auto;}
    #icon-valores {width: 95px;height: auto;}

    /*Container de Textos*/
    .ctn-texts-obj {
        display: flex;
        color: var(--titles);
        justify-content: center;
        text-align: center;
        align-items: center;
        flex-direction: column;
    }

    /*Subtítulos de Objetivos*/
    .title-obj {margin: 8px;text-transform: uppercase;}

    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }

    .ctn-texts-obj ul {margin: 0;text-align: start; padding: 0;}
    .ctn-texts-obj li {margin: 0; font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj {display: none}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:95%; height: 360px;}
    /************************************/

    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-mobile.png) center no-repeat;
        height:auto;

    }

    .footer-cont {
        width: 100%;
        height: auto;
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: none;
        flex-direction: column;
    }
    .footer-info {
        width: 100%;
        flex-direction: column;
        height: auto;
        gap: 0px;
        align-items: flex-start; 
    }

    .card-info-f {
        margin: 0;
        width: 100%;
        height: auto;
        padding: 0 8px;
        text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }

    #icon-sol {width: 90px; height: auto;}

    .title-footer {font-size: 20px;text-align: left;}

    .card-info-f ul {padding: 10px 0px;}

    .card-info-f li a {justify-content: flex-start; font-size: 16px;}

    .card-info-f p {font-size: 16px; text-align: left;}

    .ctn-sm {gap: 15px;margin-top: 0px;}

    .ctn-sm a img {width: 45px; height: auto;}

    #icon-insta {width: 40px; height: auto;}

    .foo-descrition {width: 100%; text-align: center;}

    .foo-descrition p {font-size: 13px; text-align: center;}

    .p1 {order: 1;}
    .p2 {order: 2;}
    .p3 {order: 3;}
/************************************/
}
/*REPONSIVIDADE TABLET*/
@media (min-width: 767px) and (max-width: 900px) {

    body { padding: 90px 0 0 0 ;}
    html, body {overflow-x: hidden;}
    
    /* Menu mobile*/
    .nav-mobile {top: 90px;}

    /* Lista dentro do menu */
    .nav-mobile ul {
        text-align: center;
        display: flex;
        flex-direction: column;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .nav-mobile li a {
        color: white;
        text-decoration: none;
        padding: 13px 15px;
        display: block;
        font-size: 20px;
    }

    .nav-mobile li a:hover {color: #ffc800;}

    /* Botão mobile */
    .menu-toggle {font-size: 32px;}

    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {justify-content:space-evenly; gap: 50%;}

      /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header{
        width: 100%;
        height: 90px;
        display: flex;
        justify-content: space-evenly;
        gap: 50%;
        background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    }

    .nav-overlay {top: 90px; height: calc(100% - 90px); }

    /*Logo da Barra de Navegação*/
    .logo a img {width:260px; height: auto;}

    /*Opções da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}  
    
    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 445px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 290px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
        
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -30px; gap: 0px;}

    /*Logo*/
    .logo-sobre img {width: 360px; height: auto;
    }

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 20px;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 37px;}

    .section-objectives h1 {
        display: flex;
        align-items: center;
        font-size: 37px;
    }

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {
        display: flex;
        align-items: center;
        gap:5px;
    }

    /*Cards*/
    .card-obj {width: 260px; height: 220px;}
    .card-obj img {width: 80px; height: auto;}

    #icon-valores {width: 106px; height:81px;}
    #text-valores {margin: 0 0 20px 0; text-transform: uppercase;}

    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }
    .ctn-texts-obj li {font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj {display: none;}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:89%; height: 388px;}
    /************************************/  

    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-tablet.png) center no-repeat;
        height:420px;
        border-top: 5px solid var(--lines);
        align-items: center;
        justify-content: center;
        display: flex;
    }

    .footer-info {width: 100%;}

    /*Card Footer*/
    .card-info-f {width: 100%;}

    /*CARD CONTATO*/
    .card-info-f ul {padding: 0 0 0 60px;}

    /*CARD AGREDECIMENTO NH*/
    .card-info-f p {font-size: 18px;}    
    /*----------------------------*/   
    
    /*Descrição Final*/
    .foo-descrition {width: 70%;}

    /*Copyright*/
    .foo-descrition p {font-size: 18px;}
/************************************/
}
/*REPONSIVIDADE 901 até 1023*/
@media (min-width: 901px) and (max-width: 1023px) {

    body {padding: 90px 0 0 0 ;}
    html, body {overflow-x: hidden;}
    
    /* Menu mobile*/
    .nav-mobile {top: 90px;}

    /* Lista dentro do menu */
    .nav-mobile ul {
        text-align: center;
        display: flex;
        flex-direction: column;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .nav-mobile li a {
        color: white;
        text-decoration: none;
        padding: 13px 15px;
        display: block;
        font-size: 20px;
    }

    .nav-mobile li a:hover {color: #ffc800;}

    /* Botão mobile */
    .menu-toggle {font-size: 32px;}

    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {justify-content:space-evenly;gap: 50%;}

      /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        width: 100%;
        height: 90px;
        display: flex;
        justify-content: space-evenly;
        gap: 50%;
        background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    }

    .nav-overlay {top: 90px; height: calc(100% - 90px); }

    /*Logo da Barra de Navegação*/
    .logo a img{width:260px;height: auto;}

    /*Config da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}  
    
    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 445px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 290px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
        
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -30px;gap: 0px;}

    /*Logo*/
    .logo-sobre img {width: 360px;height: auto;}

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 20px;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 40px;}

    .section-objectives h1 {
        display: flex;
        align-items: center;}

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {
        display: flex;
        align-items: center;
        gap:5px;
    }

    /*Cards*/
    .card-obj {width: 260px; height: 220px;}
    .card-obj img{width: 80px; height: auto}

    #icon-valores {width: 106px; height:81px;   }
    #text-valores {margin: 0 0 20px 0; text-transform: uppercase;}

    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }

    .ctn-texts-obj li {font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj {display: none;}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:90%;height: 450px;}
    /************************************/  

    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-tablet.png) center no-repeat;
        height:420px;
        border-top: 5px solid var(--lines);
        align-items: center;
        justify-content: center;
        display: flex;
    }

    .footer-info {width: 100%;}

    /*Card Footer*/
    .card-info-f {width: 100%;}

    /*CARD CONTATO*/
    .card-info-f ul {padding: 0 0 0 60px;}
    /*----------------------------*/

    /*CARD AGREDECIMENTO NH*/
    .card-info-f p {font-size: 18px;}    
    /*----------------------------*/   
    
    /*Descrição Final*/
    .foo-descrition { width: 70%;}

    /*Copyright*/
    .foo-descrition p {font-size: 18px;}
    /************************************/
}
/*REPONSIVIDADE TABLET DEITADO*/
@media (min-width: 1024px) and (max-width: 1100px) {

    body {padding: 100px 0 0 0 ;}
    html, body {overflow-x: hidden;}
    
    /* Menu mobile*/
    .nav-mobile {top: 100px;}

    .nav-mobile li a {padding: 13px 15px;font-size: 20px;}

    .nav-mobile li a:hover { color: #ffc800;}

    /* Botão mobile */
    .menu-toggle {font-size: 32px;}

    /* Exibir e animar o menu mobile */
    .nav-mobile.active {
        max-height: 500px;
        opacity: 1;
        pointer-events: auto;
    }

    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        height: 100px;
        justify-content: space-evenly;
        gap: 65%;
        background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    }

    .nav-overlay {top: 100px; height: calc(100% - 100px);}

    /*Logo da Barra de Navegação*/
    .logo a img {width:240px;height: auto;
    }

    /*Config da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}

    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 500px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 390px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
        
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -30px; gap: 0px}

    /*Logo*/
    .logo-sobre img {width: 390px; height: auto;}

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 22px;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 45px;}

    .section-objectives h1 {display: flex;align-items: center;}

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {
        display: flex;
        align-items: center;
        gap:20px;
    }

    /*Cards*/
    .card-obj {width: 320px; height: 180px;}
    .card-obj img{width: 80px;height: auto;}

    #icon-valores {width: 106px; height:81px; }
    #icon-missao {width: 84px;height: auto;}
    #text-missao {margin: 12px 8px 8px 8px; }
    
    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }

    .ctn-texts-obj li {font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj {display: block;}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:89%; height: 505px;}
    /************************************/     
 
    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-1024x.png) center no-repeat;
        height:420px;
        border-top: 5px solid var(--lines);
        align-items: center;
        justify-content: center;
        display: flex;
    }

    .footer-info {width: 100%;}

    /*Card Footer*/
    .card-info-f {width: 100%;}

    /*CARD CONTATO*/
    .card-info-f ul {padding: 0 0 0 90px;}

    /*CARD AGREDECIMENTO NH*/
    .card-info-f p {font-size: 18px;}    
    
    /*Descrição Final*/
    .foo-descrition {width: 70%;}

    /*Copyright*/
    .foo-descrition p {font-size: 18px;}
    /************************************/
}
/*REPONSIVIDADE 1251 até 1279*/
@media (min-width: 1101px) and (max-width: 1279px) {

    body {padding: 100px 0 0 0 ;}
    html, body {overflow-x: hidden;}
    
    /* Menu mobile*/
    .nav-mobile {top: 100px;}

    .nav-mobile li a {padding: 13px 15px;font-size: 20px;}

    .nav-mobile li a:hover {color: #ffc800;}

    /* Botão mobile */
    .menu-toggle {font-size: 32px;}

    /* Exibir e animar o menu mobile */
    .nav-mobile.active {
        max-height: 500px;
        opacity: 1;
        pointer-events: auto;
    }

    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        height: 100px;
        justify-content: space-evenly;
        gap: 65%;
        background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    }

    .nav-overlay {top: 100px; height: calc(100% - 100px);}

    /*Logo da Barra de Navegação*/
    .logo a img {width:240px; height: auto;}

    /*Opções da Barra de Navegação*/
    .menu-toggle {display: block;}
    .nav {display: none;}

    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height: 500px;
        background:
        url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat,
        url(../Imgs/Fundos/Fundo-sobre-empresa.png) center no-repeat;
        background-size: auto 390px, cover;
        background-repeat: no-repeat;
        background-position:bottom,center;
        background-attachment: scroll;
        
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {margin-top: -30px; gap: 0px;}

    /*Logo*/
    .logo-sobre img {width: 390px; height: auto;}

    /*Mensagem*/
    #msg-logo {
        width: 85%;
        text-align: justify;
        color: var(--subtitle);
        font-size: 22px;
    }
    /*----------------------------*/
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {font-size: 50px;}

    .section-objectives h1 {display: flex; align-items: center;}

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {
        display: flex;
        align-items: center;
        gap:20px;
    }

    /*Cards*/
    .card-obj {width: 320px; height: 180px;
    }
     .card-obj img {width: 80px; height: auto;}

    #icon-valores {width: 106px; height:81px;}
    #icon-missao {width: 84px; height: auto;}
    #text-missao {margin: 12px 8px 8px 8px; }
    
    /*Descrição de Diferencias*/
    .desc-obj {
        width: 100%;
        margin: 0;
        font-size:18px;
    }

    .ctn-texts-obj li {font-size:18px;}
    /************************************/

    /*Linha Separadora dos Cards*/
    .sep-obj{ display: block;}
    /************************************/

    /*CONTAINER DE VIDEO*/
    .ctn-video {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
    }

    /*tamanhho do player*/
    .ctn-video iframe {width:95%; height: 520px;}
    /************************************/     
 
    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-1024x.png) center no-repeat;
        height:420px;
        border-top: 5px solid var(--lines);
        align-items: center;
        justify-content: center;
        display: flex;
    }

    .footer-info {width: 100%;}

    /*Card Footer*/
    .card-info-f {width: 100%;}

    /*CARD CONTATO*/
    .card-info-f ul {padding: 0 0 0 90px;}

    /*CARD AGREDECIMENTO NH*/
    .card-info-f p {font-size: 18px;}    
    /*----------------------------*/   
    
    /*Descrição Final*/
    .foo-descrition {width: 70%;}

    /*Copyright*/
    .foo-descrition p {font-size: 18px;}

    /************************************/
}
/*REPONSIVIDADE NOOTEBOOK*/
@media (min-width: 1280px) and (max-width: 1599px) {

    body { padding: 110px 0 0 0 ;}
    html, body {overflow-x: hidden;}
    
    /*CONTAINER DA BARRA DE NEVEGAÇÃO*/
    .ctn-header {
        width: 100%;
        height: 110px;
        display: flex;
        justify-content: space-evenly;
        gap: 45%;
        background: url(../Imgs/Fundos/Fundo-header.png) bottom repeat-x;
    }

    /*Logo da Barra de Navegação*/
    .logo a img {width:280px; height: auto;}

    /*Opções da Barra de Navegação*/
    .nav {display: block;}
    .menu-toggle {display: none;}
     .nav-mobile.active{display: none;}
    .nav-overlay {display: none;} 

    .nav li a {font-size: 20px;}

    /*CONTAINER SOBRE NÓS - EMPRESA*/
    .ctn-sobre {
        width: 100%;
        height:550px;
        background: url(../Imgs/Waves/Detalhe-Onda.png) bottom no-repeat, url(../Imgs/Fundos/Fundo-sobre-empresa.png) center;
    }

    /*Container da Logo e mensagem*/
    .ctn-contents {
        width: 100%;
        margin-top: -70px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 0px;
    }

    /*Logo*/
    .logo-sobre img {width: 450px; height: auto;
    }

    /*Mensagem*/
    #msg-logo {
        width: 90%;
        text-align: justify;
        color: var(--subtitle);
        font-size:25px;
        font-weight:600;
        text-indent: 1em;
    }
    /************************************/

    /*TITULO PRINCIPAL*/
    .title {
        text-align: center;
        text-transform: uppercase;
        font-size: 55px;
    }

    .section-objectives h1 {display: flex; align-items: center;
    }

    /** OBJETIVOS DA EMPRESA **/
    /*Grid para os Cards*/
    .grid-obj {gap: 20px;}

    /*Cards*/
    .card-obj {width: 400px; height: 209px;

    }
    /************************************/

    /*CONTAINER DE VIDEO*/
    /*tamanho do player*/
    .ctn-video iframe {width:70%; height: 500px;}
    /************************************/     

    /** FOOTER **/
    footer {
        width: 100%;
        background: url(../Imgs/Footer/nuvem-1280x.png) center no-repeat;
        height:420px;
        border-top: 5px solid var(--lines);
        align-items: center;
        justify-content: center;
        display: flex;
    }

    .footer-info {width: 80%;}

    /*Card Footer*/
    .card-info-f {width: 100%;}

    /*CARD CONTATO*/
    .card-info-f ul {padding: 0 0 0 90px;}

    /*CARD AGREDECIMENTO NH*/
    .card-info-f p{font-size: 18px;}    
    /*----------------------------*/   
    
    /*Descrição Final*/
    .foo-descrition{  width: 50%;}

    /*Copyright*/
    .foo-descrition p {font-size: 18px;} 

    /************************************/ 
}

@media (min-width: 1600px) {
    .nav {display: block;}
    .menu-toggle {display: none;}
    .nav-mobile.active{display: none;}
    .nav-overlay {display: none;}
}
