@charset "UTF-8"; 

@font-face {
    font-family: 'Cooperplate';
    src: url(../fonts/COPRGTL.TTF);
}


/* Variáveis globais de cor e fonte */
:root{
    --cor0: #37517E; 
    --cor1: #488CCB; 
    --cor2: #00355F;
    --cor3: #00319C;
    --cor4: #DFB235;

    --fonte01: 'Hypero', cursive;
    --fonte02: 'Cooperplate', Bold;
}

/* Reseta a margem e o padding de todos os elementos */
*{
    margin: 0px;
    padding: 0px;
}

/* Esconde a barra de rolagem, mas mantém a funcionalidade de rolagem */
html {
    overflow: -moz-scrollbars-none; /* Firefox */
    overflow-x: hidden;
    -ms-overflow-style: none; /* Internet Explorer e Edge */
    scrollbar-width: none; /* Firefox */
    scroll-behavior: smooth;
}

html::-webkit-scrollbar {
    display: none; /* Chrome, Safari e Opera */
}

/* Estilos para o elemento principal */
main{
    background-color: var(--cor0); /* Fundo da área principal */
    min-width: 300px; /* Largura mínima */
    max-width: 1280px; /* Largura máxima */
    margin: auto; /* Centraliza horizontalmente */
    margin-top: 74px; /* Config para main ficar abaixo do header */
    overflow-x: hidden;
}

body{
    background-color: white;
}

/* Estilos para o cabeçalho */
.header {
    background-color: var(--cor3); /* Fundo do cabeçalho */
    box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1); /* Sombra do cabeçalho */
    position: fixed; /* Fixa o cabeçalho no topo */
    top:-1px;
    left:0;  
    width: 100%; /* Largura total */
    z-index:1; /* Coloca o cabeçalho à frente de outros elementos */
    float:left;
}

.header ul {
    margin: 30px 10px 0px 10px;
    padding: 0;
    list-style: none; /* Remove marcadores da lista */
    overflow: hidden;
}

#config{
    display: flex;
    gap: 0px;
    margin: 4px;
    padding: 1px;
}

li#lista-config{
    padding: 10px;
}

.header li a {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    display: block;
    padding: 0.7em 0.5em;
    text-decoration: none; /* Remove sublinhado dos links */
    transition:.3s; /* Transição suave */
    border-bottom: 1px #f7f7f7 solid; /* Linha inferior nos links */
    color:white; /* Cor do texto dos links */
    margin: -6px;
}

.header li a:hover,
.header .btn-mobile:hover {
    font-size: 19px;
    background-color: transparent; /* Fundo ao passar o mouse */
    color:#fff; /* Cor do texto ao passar o mouse */
}

.header .logo {
    padding: 20px 15px 15px 15px;
    display: block;
    float: left;
}

img#logo-config{
    width: 201px;
}

.header .nav {
    clear: both;
    max-height: 0; /* Altura máxima inicial do menu (oculto) */
    transition: max-height .2s ease-out; /* Transição suave para a altura do menu */
}

.nav img{
    width: 18px;
    padding: 5px;
    border-radius: 10px;
}

.icon-instagram:hover{
    background-color: brown;
}

.icon-facebook:hover{
    background-color: var(--cor2);
}

.icon-youtube:hover{
    background-color: red;
}

.icon-linkedin:hover{
    background-color: var(--cor1);
}

/* Ícone do menu para dispositivos móveis */
.header .mobile-icon {
    cursor: pointer;
    display: inline-block;
    float: right;
    padding: 42px 10px 10px 10px;
    position: relative;
    user-select: none; /* Desabilita seleção de texto */
}

.header .mobile-icon .master-header {
    background: white;
    display: block;
    height: 2px;
    position: relative;
    transition: background .2s ease-out;
    width: 18px;
}

.header .mobile-icon .master-header:before,
.header .mobile-icon .master-header:after {
    background: white;
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transition: all .2s ease-out;
    width: 100%;
}

.header .mobile-icon .master-header:before {
    top: 5px;
}

.header .mobile-icon .master-header:after {
    top: -5px;
}

/* Checkbox que controla a exibição do menu em dispositivos móveis */
.header .mobile-btn {
    display: none;
}

.header .mobile-btn:checked ~ .nav {
    max-height: 295px; /* Altura máxima do menu ao ser ativado */
}

.header .mobile-btn:checked ~ .mobile-icon .master-header {
    background: transparent;
}

.header .mobile-btn:checked ~ .mobile-icon .master-header:before {
    transform: rotate(-45deg); /* Rotaciona a barra superior do ícone do menu */
}

.header .mobile-btn:checked ~ .mobile-icon .master-header:after {
    transform: rotate(45deg); /* Rotaciona a barra inferior do ícone do menu */
}

.header .mobile-btn:checked ~ .mobile-icon:not(.steps) .master-header:before,
.header .mobile-btn:checked ~ .mobile-icon:not(.steps) .master-header:after {
    top: 0;
}

/* Estilos para o container */
.container {
    width:100%;
    float:left;
    margin-top:100px; /* Espaço superior para evitar sobreposição com o cabeçalho fixo */
}

/* Estilos para o conteúdo principal */
.content { 
    float:left; 
    width:92%; 
    margin:0 4%;  
}

/* Media query para telas maiores (910px e acima) */
@media (min-width: 910px) {
    .header li { 
    float:left; 
    }
    
    .header li a {
        padding: 15px 30px;
        margin-top: 10px;
        border-radius: 6px;
        transition:.3s;
        border-bottom:0; 
        transition: .3s;
        border-bottom: 0;
        padding: 0px;
        margin: 3px;
    }

    #config{
        gap: 0px;
    }

    .header .nav {
        clear: none;
        float: right;
        max-height: none; /* Remove a limitação de altura */
    }
    
    .header .mobile-icon { 
        display:none; /* Esconde o ícone do menu em telas maiores */
    }
}

/* Configs estilos do slider carrosel */
section.slider {
    margin: 100px auto;            /* Centraliza o slider horizontalmente */
    margin-bottom: 0px;
    width: 100%;               /* Define a largura do slider como 100% do contêiner pai */
    height: auto;              /* Altura automática baseada no conteúdo */
    padding: 0 !important;     /* Remove qualquer padding padrão com alta prioridade */
    overflow: hidden;          /* Oculta o conteúdo que ultrapassa os limites do contêiner */
    position: relative;        /* Define o contexto de posicionamento para elementos filhos */
}

.slider-content {
    width: 400%;               /* Define a largura do contêiner de conteúdo do slider como 400% do seu contêiner pai */
    height: auto;              /* Altura automática baseada no conteúdo */
    display: flex;             /* Exibe os filhos do contêiner em uma linha */
}

.slider-content input, .img-mobile {
    display: none;             /* Oculta os inputs e as imagens móveis */
}

.slide-box {
    width: 25%;                /* Cada caixa de slide ocupa 25% do contêiner pai */
    height: auto;              /* Altura automática baseada no conteúdo */
    position: relative;        /* Posicionamento relativo para posicionamento interno */
    text-align: center;        /* Centraliza o texto dentro da caixa */
    transition: 1s;            /* Adiciona uma transição de 1 segundo para mudanças */
}

.slide-box img {
    width: 100%;               /* As imagens dentro de cada caixa de slide ocupam 100% da largura da caixa */
}

.nav-manual, .nav-auto {
    position: absolute;        /* Posiciona absolutamente dentro do contêiner pai */
    width: 40%;                /* Define a largura dos controles de navegação */
    top: 35%;                  /* Define a posição superior */
    display: flex;             /* Exibe os filhos em linha */
    justify-content: center;   /* Centraliza os filhos horizontalmente */
    left: 50%;                 /* Posiciona no meio horizontal do contêiner pai */
    transform: translateX(-50%); /* Ajusta para realmente centralizar com 50% de deslocamento negativo */
}

.nav-manual .manual-btn, .nav-auto div {
    border: 1px solid var(--cor0); /* Define uma borda com a variável de cor --cor0 */
    padding: 10px;                  /* Adiciona preenchimento de 10px */
    border-radius: 50%;             /* Faz os botões circulares */
    cursor: pointer;                /* Mostra o cursor de ponteiro ao passar sobre o botão */
    transition: 0.2s;               /* Adiciona uma transição de 0.2 segundos para mudanças */
}

.nav-manual .manual-btn:not(:last-child), .nav-auto div:not(:last-child) {
    margin-right: 10px;             /* Adiciona margem direita de 10px para todos, exceto o último botão */
}

.nav-manual .manual-btn:hover {
    background-color: var(--cor1);  /* Muda a cor de fundo para a variável --cor1 ao passar o mouse */
}

#radio1:checked ~ .nav-auto .auto-btn1, #radio2:checked ~ .nav-auto .auto-btn2, #radio3:checked ~ .nav-auto .auto-btn3 {
    background-color: var(--cor1);  /* Muda a cor de fundo do botão automático correspondente quando o rádio está marcado */
}

#radio1:checked ~ .primeiro {
    margin-left: 0%;                /* Move o primeiro slide para a margem esquerda de 0% quando o primeiro rádio está marcado */
}

#radio2:checked ~ .primeiro {
    margin-left: -25%;              /* Move o primeiro slide para a margem esquerda de -25% quando o segundo rádio está marcado */
}

#radio3:checked ~ .primeiro {
    margin-left: -50%;              /* Move o primeiro slide para a margem esquerda de -50% quando o terceiro rádio está marcado */
}

@media screen and (max-width: 900px) { /* Estilos para telas com largura máxima de 900px */
    .img-desktop {
        display: none;              /* Oculta as imagens de desktop */
    }

    .img-mobile {
        display: block;             /* Exibe as imagens móveis */
    }

    .nav-auto, .nav-manual {
        top: auto;                  /* Remove a posição superior */
        margin-top: 40%;            /* Aumenta a margem superior para 40% */
        width: 90%;                 /* Define a largura dos controles de navegação para 90% */
        margin-left: 5%;            /* Adiciona margem esquerda de 5% */
        left: auto;                 /* Remove o posicionamento à esquerda */
        transform: none;            /* Remove a transformação de translação */
    }
}

@media screen and (min-width: 901px) and (max-width: 1024px) { /* Estilos para telas entre 901px e 1024px */
    .nav-auto, .nav-manual {
        top: 93%;                   /* Define a posição superior */
        margin-top: 0;              /* Remove a margem superior */
        width: 40%;                 /* Define a largura dos controles de navegação */
        left: 50%;                  /* Posiciona no meio horizontal do contêiner pai */
        transform: translateX(-50%); /* Centraliza com 50% de deslocamento negativo */
    }
}

@media screen and (min-width: 1025px) { /* Estilos para telas com largura mínima de 1025px */
    .nav-auto, .nav-manual {
        top: 94%;                   /* Define a posição superior */
        margin-top: 0;              /* Remove a margem superior */
        width: 40%;                 /* Define a largura dos controles de navegação */
        left: 50%;                  /* Posiciona no meio horizontal do contêiner pai */
        transform: translateX(-50%); /* Centraliza com 50% de deslocamento negativo */
    }
}

.catalogos {
    background-image: url(../images/BackgroundFernandas.jpg);
    background-repeat: repeat;
    text-align: center;
    width: auto;
    height: auto; /* Ajuste para altura automática para responsividade */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -2px;
}

.catalogos h1 {
    margin: 80px;
    font-size: 40px;
}

.catalogo {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 125px;
    max-width: 100%;
}

.catalogo img{
    box-shadow: -12px -5px 15px rgba(0, 0, 0, 0.317);
    width: 216px;
    height: 316px;
}

.item-catalogo {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.imagens-catalogos img {
    box-shadow: -12px -5px 15px rgba(0, 0, 0, 0.317);
    width: 210px;
    height: 316px;
}

.link-catalogos {
    margin-top: 10px;
}

.link-catalogos a {
    background-image: linear-gradient(to right, var(--cor4), white);
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    border-color: #DFB235;
    border-style: solid;
    font-weight: bold;
    padding: 15px;
    display: inline-flex;
    text-decoration: none;
    color: var(--cor3);
    border-radius: 50px;
}

h1#texto-rodape{
    font-family: Arial Black;
    font-size: 30px;
}

h1{
    font-family: var(--fonte02);
    font-weight: bold;
    color: var(--cor3);
}

/* Div Sobre-nós */
.sobre-nos{
    background-image: url(../images/BackgroundAzul.jpg);
    background-repeat: repeat;
    height: auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.sobre-nos h1{
    background: linear-gradient(to right, var(--cor4), white);
    -webkit-background-clip: text;
    color: transparent;
    text-align: center;
    font-size: 50px;
    margin: 80px;
}

.sobre-nos p{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    padding: 170px;
    margin: 50px;
    padding-top: 0px;
    padding-bottom: 0px;
    text-align: justify;
    color: white;
}

.sobre-nos a{
    background: linear-gradient(to right, var(--cor4), white);
    color: var(--cor2);
    text-decoration: none;
    cursor: auto;
}

.imagens-empresa{
    max-width: 100%;
    height: auto;
    padding: auto;
}

.imagens-empresa img{
    padding: 15px;
}

/* DIV do FAQ */
.faq{
    background-image: url(../images/BackgroundFernandas.jpg);
    background-repeat: repeat;
    height: auto;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 20px;
}

.titulos-faq{
    font-family: var(--fonte01);
    color: var(--cor0);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    padding-top: 50px;
    padding-bottom: 0px;
}

.titulos-faq h1{
    font-size: 40px;
    padding: 10px;
}

.titulos-faq h2{
    font-family: Arial, Helvetica, sans-serif;
    color: var(--cor3);
    font-size: 17px;
}

.perguntas{
    text-align: center;
}

.perguntas details{
    text-align: center;
    padding: 20px 150px;
    animation-delay: 5ms;
    margin-bottom: 15px;
}

.perguntas summary:hover{
    background-color: #488ccb63;
    transition-duration: 0.5s;
}

.perguntas summary{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    background-color: lightgray;
    color: var(--cor3);
    border-color: var(--cor3);
    border-radius: 15px;
    border-style: groove;
    text-align: left;
    padding: 15px;
}

.perguntas p{
    font-family: Arial, Helvetica, sans-serif;
    color: var(--cor3);
    font-size: 18px;
    font-weight: bold;
    text-align: justify;
    padding-top: 10px;
}

details[open] summary ~ * {
    animation: sweep .5s ease-in-out;
}

@keyframes sweep {
    0%    {opacity: 0; margin-left: -10px}
    100%  {opacity: 1; margin-left: 0px}
}

.contato{
    font-family: Arial, Helvetica, sans-serif;
    background-image: url(/images/BackgroundAzul.jpg);
    color: white;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
}

.div-endereco, .contato-email {
    background-color: var(--cor2);
    box-shadow: -11px -3px 15px rgba(0, 0, 0, 0.317);
    text-align: center;
    border-radius: 15px;
    padding: 20px;
    box-sizing: border-box;
    flex: 1;
    margin: 10px;
    min-width: calc(50% - 20px); /* Ajusta a largura mínima das divs */
}

.contato h1{
    background: linear-gradient(to right, var(--cor4), white);
    -webkit-background-clip: text;
    color: transparent;
    text-align: center;
    font-size: 50px;
    width: 100%;
    padding: 50px;
}

.container-contato{
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    flex-wrap: wrap;
}

.div-endereco img#logo-redondo{
    padding: 10px 10px 10px 10px;
    text-align: center;
}

.div-endereco img{
    padding: 0px 10px 0px 10px;
}

.div-endereco p{
    padding: 10px 10px 10px 10px;
    text-align: left;
}

.div-endereco iframe{
    width: 100%;
    border: none;
}

.contato-email input{
    width: 93%;
    padding: 10px;
    border-radius: 15px;
    border: none;
}

.contato-email textarea{
    width: 100%;
    height: 100%;
    border: none;
}

.contato-email button{
    background-color: rgb(64, 244, 64);
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-weight: bold;
    font-size: large;
    width: 200px;
    height: 50px;
    border-radius: 15px;
    border: none;
    cursor: pointer;
}

.contato-email button:hover{
    background: green;
    transition: 0.5s;
}

.termos-politicas{
    background-color: white;
    height: auto;
    width: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    text-decoration: none;
}

.conteudo-termos{
    display: flex;
    justify-content: center;
    align-items: center;
}

.container-termos{
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
}

.conteudo-termos h2{
    font-family: Arial, Helvetica, sans-serif;
    color: black;
    text-align: left;
    margin: 5px;
}

.conteudo-termos ul{
    padding: 50px;
    list-style-type: none;
}

.container-termos a{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 19px;
    color: black;
    text-decoration: none;
}

.container-termos li{
    font-family: Arial, Helvetica, sans-serif;
}

.container-termos a:hover{
    text-decoration: underline;
}

.conteudo-termos img{
    width: 201px;
    height: 45px;
    padding: 100px 0px 0px 60px;
}

footer{
    font-family: Arial, Helvetica, sans-serif;
    background-color: var(--cor3);
    color: white;
    text-align: center;
    height: 30px;
    padding: 20px 10px 24px 10px;
}
footer a{
    color: white;
}

.whatsappLink{
    position: fixed;
    cursor: pointer;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 23px;
    background-color: #25d366;
    color: white;
    border-radius: 50px;
    text-align: center;
    font-size: 36px;
    box-shadow: 1px 1px 2px gray;
}

.whatsappLink:hover{
    background-color: #059d3d;
    transition: 0.5s;
}

.icon{
    margin-top: 13px;
    color: white;
    width: 31px;
}

/* TODOAS AS MEDIA SCREEN!!!! EXCETO O HEADER E O BANNER */
/* Config responsividade para Tablets */
@media screen and (min-width: 768px) and (max-width: 1024px){

    html, body {
        overflow-x: hidden;
        }

    .catalogos{
        padding: 60px;
        height: auto;
        display: flex;
        gap: 50px;
        flex-direction: column;
    }

    .catalogos h1{
        margin: 15px;
    }

    .imagens-catalogos{
        display: flex;
        gap: 50px;
        max-width: 100%;
        height: auto;
    }

    .link-catalogos a{
        display: none;
    }

    .catalogos h1{
        display: flex;
        font-size: 30px;
        padding: 0px;
    }

    h1#titulo-rodape{
        padding: 10px;
    }

    .sobre-nos{
        height: auto;
        padding: 60px;
        background-repeat: repeat;
    }

    .sobre-nos p{
        padding: 20px;
    }

    .faq{
        background-repeat: repeat;
        height: auto;
    }

    .titulos-faq{
        font-family: var(--fonte01);
        color: var(--cor0);
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        padding-top: 80px;
        padding-bottom: 0px;
        padding-left: 50px;
        padding-right: 50px;
    }
    
    .titulos-faq h1{
        font-size: 8vh;
        padding: 10px;
    }
    
    .titulos-faq h2{
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        font-size: 17px;
    }

    .perguntas details {
        text-align: center;
        padding: 20px 50px;
        animation-delay: 5ms;
    }

    .container-contato{
        flex-direction: row;
    }

    .div-endereco, .contato-email {
        width: calc(50% - 20px); /* Divide o espaço igualmente */
        margin: 10px;
    }

    .container-termos{
        flex-direction: row;
        gap: 30px;
    }

    .conteudo-termos img{
        width: 164px;
        height: 40px;
        padding: 70px 0px 0px 85px;
    }

    .conteudo-termos ul{
        padding: 15px 0px 0px 0px;
        margin: 10px;
    }

    .container-termos li{
        font-size: 13px;
        padding: 0px 45px 0px 0px;
    }

    .conteudo-termos a{
        font-size: 13px;
    }

    .whatsappLink{
        width: 48px;
        height: 48px;
        bottom: 40px;
        right: 23px;
    }

    .icon{
        margin-top: 8px;
    }
}

/* Config responsividade para Celulares */
@media screen and (max-width: 767px){

    html, body {
        overflow-x: hidden;
        }

    .catalogos{
        height: auto;
        display: flex;
        flex-direction: column;
    }

    .imagens-catalogos{
        display: flex;
        flex-direction: column;
        gap: 88px;
        max-width: 100%;
        height: auto;
    }

    .link-catalogos a{
        display: none;
    }

    .catalogos h1{
        font-size: 30px;
        padding: 10px;
    }

    h1#titulo-rodape{
        padding: 10px;
    }

    .sobre-nos{
        height: auto;
        background-repeat: repeat;
    }

    .sobre-nos p{
        padding: 20px;
    }

    .faq{
        background-repeat: repeat;
        height: auto;
    }

    .titulos-faq{
        font-family: var(--fonte01);
        color: var(--cor0);
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        padding-top: 80px;
        padding-bottom: 0px;
        padding-left: 50px;
        padding-right: 50px;
    }
    
    .titulos-faq h1{
        font-size: 8vh;
        padding: 10px;
    }
    
    .titulos-faq h2{
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        font-size: 17px;
    }

    .perguntas details {
        text-align: center;
        padding: 20px 50px;
        animation-delay: 5ms;
    }

    .container-contato{
        flex-direction: column;
        align-items: center;
    }

    .div-endereco, .contato-email {
        width: 100%;
        min-width: unset; /* Remove a largura mínima para telas menores */
        margin: 10px 0;
    }

    .container-termos{
        flex-direction: column;
        align-items: center;
    }

    .container-termos li{
        text-align: center;
    }

    .container-termos a{
        font-size: 16px;
    }

    .container-termos h2{
        text-align: center;
        font-size: 18px;
    }

    .conteudo-termos img{
        width: 201px;
        padding: 10px 0px 0px 0px;
    }

    .conteudo-termos ul{
        padding: 25px;
    }

    .whatsappLink{
        width: 48px;
        height: 48px;
        bottom: 12px;
        right: 10px;
    }

    .icon{
        margin-top: 8px;
    }
}


/* Config responsividade para Celulares antigos */
@media screen and (max-width: 470px){

    html, body {
        overflow-x: hidden;
        }

    .catalogos{
        height: auto;
    }

    .link-catalogos a{
        display: none;
    }

    .catalogos h1{
        font-size: 30px;
        padding-bottom: 0px;
    }

    h1#titulo-rodape{
        padding: 10px;
    }

    .sobre-nos{
        height: auto;
        background-repeat: repeat;
    }

    .sobre-nos p{
        padding: 20px;
    }

    .sobre-nos h1{
        font-size: 5vh;
    }

    .faq{
        background-repeat: repeat;
        height: auto;
    }

    .titulos-faq{
        font-family: var(--fonte01);
        color: var(--cor0);
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        padding-top: 80px;
        padding-bottom: 0px;
        padding-left: 50px;
        padding-right: 50px;
    }
    
    .titulos-faq h1{
        font-size: 8vh;
        padding: 10px;
    }
    
    .titulos-faq h2{
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
        font-size: 17px;
    }

    .perguntas details {
        text-align: center;
        padding: 20px 50px;
        animation-delay: 5ms;
    }

    .contato-email {
        padding: 10px; /* Ajuste de padding para telas menores */
    }

    .conteudo-termos ul{
        padding: 25px;
    }

    .conteudo-termos a{
        font-size: 15px;
    }

    footer{
        padding: 15px 10px 40px 10px;
    }
}