/* importar fonts */
/*@font-face {
    font-family: 'Artega';
    src: url('Artega.otf') format(opentype);
} */

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    font-family:'Segoi', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #ffffff;
}

.name {
    padding-bottom: 20px;
}

.header {
    background-image: url(./Assets/header.png);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    padding-top: 40px;
    height: 100px;
    text-align: center;
    position: fixed;
    width: 100%;
    z-index: 1000; /* Garante que o header esteja acima do conteúdo */
}

.header-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-nav ul li {
    margin-left: 50px; /* Espaçamento entre os itens do menu */
    display: inline;
}

.header-nav ul li a {
    text-decoration: none;
    font-weight: bold;
    font-size: 20px;
    background: linear-gradient(to bottom, #9211ee 50%, #1929f0); /* Gradiente roxo */
    background-clip: text; /* Aplicar gradiente apenas ao texto */
    color: transparent; /* Tornar o texto transparente */
    transition: 0.2s ease; /* Adicionar uma transição suave */
    position: relative; /* Adiciona posicionamento relativo para que a posição do sublinhado seja relativa ao link */
}

.header-nav ul li:hover a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px; /* Ajuste para posicionar o sublinhado abaixo do texto */
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    transform: scaleX(0); /* Inicialmente sem largura (efeito de crescimento do sublinhado) */
    transition: transform 0.2s ease;
}

.header-nav ul li:hover a::after {
    transform: scaleX(1); /* Ao passar o mouse, expande o sublinhado */
}

.sobre {
    text-align: center; /* Centralizar o conteúdo horizontalmente */
    background-color: #000000;
    padding-top: 150px;
}

.main-content {
    margin-top: -10px; /* Espaço entre banner e segundo header */
}

.titles {
    font-size: 50px;
    background: linear-gradient(to bottom, #9211ee 50%, #1929f0);
    background-clip: text;
    color: transparent;
}

.subtitles {
    display: block; /* Garante que o subtítulo esteja em uma nova linha */
    font-size: 40px;
    background: linear-gradient(to bottom, #9211ee 50%, #1929f0);
    background-clip: text;
    color: transparent;
    padding-top: 10px;
}

.texts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: center;
    padding-top: 30px;
    padding-bottom: 30px;
    color:#fff;
    font-family: URW Chancery L, cursive;
    font-size: large;
}

/* Cards */
.nossos-valores {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: center;
    padding-top: 15px;
    color:#fff;
}

.card-services {
   margin-bottom: 60px; /*espaçamento dos cards*/
   flex: 0 0 20%; /*Organiza os cards*/
}

.card-item {
    display: block;
    height: 100%;
    width: 95%;
    padding: 30px 15px;
    background: rgba(128, 128, 128, 0.199);
    /*background: hsla(210, 3%, 75%, .4);*/
    border-radius: 10px;
    /*box-shadow: 0 3px 30px 0 rgba(0, 0, 0, .15);*/
    box-shadow: 0 3px 15px #cc01ffa1;
    text-align: center;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    text-decoration: none;
    color: #ffffff; /*cor do texto*/
}
/*
footer {
	background-color: #202020;
	color: #fff;
	padding: 20px;
	text-align: center;
	margin-top: 50px;
}

ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

li {
	display: inline-block;
	margin: 0 10px;
}

a {
	color: #fff;
	text-decoration: none;
}*/
.footer {
    padding: 40px 0;
    background: #036;
    color: #fff;
    font-size: .813rem;
    font-weight: 300;
    line-height: 1.6;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    display: block;
}

.container {
    max-width: 960px;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.align {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.logo-footer {
    margin-bottom: 0;
    display: flex;
}

.divisão1 {
    margin-bottom: 0;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
    flex: 0 0 33.333333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.footer_nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 50px;
}

.footer_nav ::before {
    position: absolute;
    top: 0;
    left: 30px;
    display: block;
    content: "";
    width: 2px;
    height: 100%;
    background-color: #fff;
}

.menu-footer1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33%;
    flex: 0 0 33%;
}

.rodape{
    background-color: #272727;
    color: white;
    height: auto;
    width: 100%;
    font-size: 14px;
    font-family: helvetica;
}
.rodape a{
    text-decoration: none;
    color: white;
}
.rodape p{
    margin-bottom: 5px;
}
.rodape-div{
    display: flex;
    flex-wrap: wrap;
    width:100%;
    margin: auto;
    align-items: stretch;
    padding: 60px 10px 40px 10px;
}
.rodape-div-1, .rodape-div-2, .rodape-div-3, .rodape-div-4{
    display: flex;
    width: calc(100% / 4 - 20px);
    padding: 10px;
}
.rodape span{
    font-size: 20px;
    color: white;
}
.rodape-direitos{
    width: calc(100% - 20px);
    background-color: black;
    padding: 10px;
    margin: 0px;
    text-align: center;
}
/*mobile*/
@media (max-width: 768px) {
    .rodape-div-1, .rodape-div-2, .rodape-div-3, .rodape-div-4{
        width: calc(50% - 20px);
        padding: 10px;
    }
    .rodape-div{
        padding: 60px 0px 40px 0px;
    }
}