@charset "UTF-8";
/*
Theme Name: Nacaodesign
Description: Tema customizado pela NaçãoDesign
Theme URI:   https://nacaodesign.com.br
Author: Ricardo Campos / NaçãoDesign
Author URI:  https://nacaodesign.com.br
Template: salient
Version: 1.0
*/

/* Força a borda preta de 4px nos cards de servicos do carrossel da home */
.secao-carrossel-servicos .nectar-carousel .cell .inner-wrap {
    border: 4px solid #000000 !important;
}

/* ==========================================================================
   CUSTOMIZACÃO POST GRID
   ========================================================================== */

/* 1. Flexbox container para reposicionar o Mercado acima do Título */
.grid-projetos .nectar-post-grid-item .content .item-main {
    display: flex !important;
    flex-direction: column !important;
}

/* 2. Reordenação dos elementos visuais */
.grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_mercado"] {
    order: 1; /* Sobe para o topo */
}

.grid-projetos .post-heading {
    order: 2; /* Fica no meio */
}

.grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_tipo"] {
    order: 3; /* Fica por último */
}

/* 3. Desativa o container flex padrão dos custom fields para os filhos responderem ao flex-parent */
.grid-projetos .nectar-post-grid-item__custom-fields {
    display: contents !important;
}


/* ==========================================================================
   OVERLAY NA IMAGEM (RESTING STATE vs HOVER)
   ========================================================================== */

/* Pseudo-elemento ::after para criar a camada preta sobre a imagem */
.grid-projetos .nectar-post-grid-item .nectar-post-grid-item-bg-wrap-inner {
    position: relative !important;
}

.grid-projetos .nectar-post-grid-item .nectar-post-grid-item-bg-wrap-inner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.10); /* Overlay de 10% de preto no estado padrão (Resting) */
    transition: background-color 0.3s ease, opacity 0.3s ease; /* Transição suave */
    pointer-events: none; /* Garante que os cliques passem direto para o link do card */
    z-index: 2;
}

/* Remove o overlay no Mouseover (Hover) */
.grid-projetos .nectar-post-grid-item:hover .nectar-post-grid-item-bg-wrap-inner::after {
    background-color: rgba(0, 0, 0, 0); /* Torna o overlay 100% transparente no hover */
}


/* ==========================================================================
   ESTILIZAÇÃO DOS ELEMENTOS (TAG, TÍTULO E TIPO)
   ========================================================================== */

/* --- A. TAG DE MERCADO (Destaque Amarelo) --- */
.grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_mercado"] {
    display: inline-block !important;
    width: auto !important;
    float: none !important;
    align-self: flex-start;
    background-color: #f3d448; /* Cor amarela do modelo */
    color: #000000 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 14px !important;
    margin-top: 15px !important;
    margin-bottom: 12px !important;
    line-height: 1.2 !important;
}

/* Esconde a tag caso o campo esteja vazio no post */
.grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_mercado"]:empty {
    display: none !important;
}

/* --- B. TÍTULO DO PROJETO --- */
.grid-projetos .post-heading {
    margin: 0 0 4px 0 !important;
}

.grid-projetos .post-heading span,
.grid-projetos .post-heading a {
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.20 !important;
    text-transform: uppercase;
    color: #000000 !important;
	display: inline-block; /* Garante aplicação precisa do line-height no elemento a/span */
}

/* --- C. TIPO DE PROJETO (Subtítulo) --- */
.grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_tipo"] {
    font-size: 15px !important;
    font-weight: 400 !important;
    color: #333333 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    text-transform: none; /* Mantém letras maiúsculas/minúsculas naturais */
}

/* ==========================================================================
   AJUSTES NO FILTRO LATERAL (SIDEBAR FILTER) - DESKTOP
   ========================================================================== */

/* 1. Espaçamento entre a coluna do filtro e o grid de projetos */
.grid-projetos.nectar-post-grid-wrap--fl-sidebar_left .nectar-post-grid-filters {
    margin-right: 15px !important;
}

/* 2. Tamanho da fonte dos links no Desktop */
.grid-projetos .nectar-post-grid-filters a {
    font-size: 13px !important;
    line-height: 1.4 !important;
}

/* 3. Título "FILTRAR" no Desktop */
.grid-projetos .nectar-post-grid-filters h4 {
    font-size: 12px !important;
    margin-bottom: 15px !important;
}

/* Ajustes gerais */
.sombra-texto {
    text-shadow: 0 3px 6px rgba(0,0,0,.3);
}

body #ajax-content-wrap .nectar-post-grid .flickity-page-dots {
    bottom: -30px;
}

.grid-link .nectar-post-grid-wrap[data-style=content_under_image] a {
    pointer-events: none;
}

#header-outer #top > .container > .row ul > li.menu-item-gtranslate {
    & > a {
        font-size: 0;
    }

    & > a::before {
        font-family: FontAwesome;
        font-size: 26px;
        font-weight: normal;
        font-style: normal;
        text-decoration: inherit;
        -webkit-font-smoothing: antialiased;
        line-height: 1;
        content: "\f0ac";
    }

    & > a > img,
    & > a > span {
        display: none;
    }
}

.gt_white_content .gt_languages img {
    display: none;
}

#slide-out-widget-area .off-canvas-menu-container ul li.menu-item-gtranslate {
    display: none;
}

/* ==========================================================================
   AJUSTES EXCLUSIVOS PARA MOBILE (NÃO INTERFEREM NO DESKTOP)
   ========================================================================== */

@media only screen and (max-width: 999px) {

    /* 1. Ajuste do Título do Projeto no Mobile (Reduzido de 22px para 17px) */
    .grid-projetos .post-heading span,
    .grid-projetos .post-heading a {
        font-size: 15px !important;
        line-height: 1.15 !important;
    }

    /* 2. Ajuste do Tipo de Projeto / Subtítulo no Mobile (Reduzido de 15px para 13px) */
    .grid-projetos .nectar-post-grid-item__custom-field[data-key="nome_do_tipo"] {
        font-size: 13px !important;
        line-height: 1.25 !important;
    }

    /* 3. Mantém o botão "FILTRAR" alinhado à esquerda */
    .grid-projetos .nectar-post-grid-filters,
    .grid-projetos .nectar-post-grid-filters .n-sticky,
    .grid-projetos .nectar-post-grid-filters h4 {
        text-align: left !important;
        align-items: flex-start !important;
        margin-left: 0 !important;
        margin-right: auto !important;
        display: block !important;
    }

    .grid-projetos .nectar-post-grid-filters h4 {
        display: inline-block !important;
        width: auto !important;
    }

    /* 4. Formatação da lista de filtros quando aberta (.visible) */
    .grid-projetos .nectar-post-grid-filters div.visible {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        margin-top: 15px !important;
    }

    /* 5. Ajuste do texto dos filtros no mobile */
    .grid-projetos .nectar-post-grid-filters div.visible a {
        display: block !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        text-align: left !important;
        margin-bottom: 10px !important;
        padding-left: 28px !important;
        box-sizing: border-box !important;
    }

    /* Reseta sobreposições nos pseudo-elementos para o tema controlar os rádios */
    .grid-projetos .nectar-post-grid-filters div.visible a::before,
    .grid-projetos .nectar-post-grid-filters div.visible a::after {
        margin-top: 0 !important;
    }
}

/* ==========================================================================
   ESTILIZAÇÃO DOS LINKS DE TAXONOMIA (CATEGORIA E MERCADO)
   ========================================================================== */

/* 1. Estiliza o texto e o sublinhado customizado (Amarelo 2px) */
.links-taxonomia h5,
.links-taxonomia h5 a {
    color: #000000 !important;                  /* Cor do texto em preto */
    text-decoration: underline !important;       /* Ativa o sublinhado */
    text-decoration-color: #F6D84C !important;  /* Cor amarela do sublinhado */
    text-decoration-thickness: 2px !important;   /* Espessura do sublinhado em 2px */
    text-underline-offset: 4px !important;       /* Distância do sublinhado para o texto */
    line-height: 1.5 !important;                /* Entrelinha confortável para múltiplas linhas */
    display: inline;
}

/* 2. Efeito ao passar o mouse (Hover) */
.links-taxonomia h5 a:hover {
    color: #333333 !important;                  /* Suaviza levemente a cor do texto no hover */
    text-decoration-color: #000000 !important;  /* Muda a linha para preto no hover */
}

/* ==========================================================================
   ESTILO CABEÇALHO DE ARQUIVO DINÂMICO (LARGURA TOTAL / BREAKOUT)
   ========================================================================== */

/* 1. Força o fundo cinza a ir de ponta a ponta da tela */
.custom-archive-header-wrap {
    background-color: #f5f5f5; /* Cor cinza do fundo */
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-bottom: 50px !important;
    padding: 60px 0 !important;
    box-sizing: border-box;
}

/* 2. Mantém o texto (Título e Descrição) alinhado dentro da largura do site */
.custom-archive-header-inner {
    max-width: 1425px; /* Alinha com o limite padrão do container do Salient */
    margin: 0 auto !important;
    padding: 0 90px !important; /* Espaçamento interno para acompanhar as margens do grid */
    box-sizing: border-box;
}

/* 3. Título Grande */
.custom-archive-header-wrap .custom-archive-title {
    font-size: 42px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    color: #000000 !important;
    letter-spacing: -0.5px;
    margin: 0 0 15px 0 !important;
    line-height: 1.1 !important;
}

/* 4. Descrição do Termo */
.custom-archive-header-wrap .custom-archive-description,
.custom-archive-header-wrap .custom-archive-description p {
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #333333 !important;
    max-width: 900px;
    margin: 0 !important;
}

/* Responsivo para telas menores / mobile */
@media only screen and (max-width: 999px) {
    .custom-archive-header-inner {
        padding: 0 30px !important;
    }
}

@media only screen and (max-width: 690px) {
    .custom-archive-header-wrap {
        padding: 40px 0 !important;
    }
    .custom-archive-header-inner {
        padding: 0 20px !important;
    }
    .custom-archive-header-wrap .custom-archive-title {
        font-size: 30px !important;
    }
}

/* Formulários */
body .wpcf7 {
  input,
  textarea {
    margin-top: 6px;
  }

  input[type=text],
  input[type=email] {
    border-bottom: 4px solid #000;
  }

  textarea {
    border: 4px solid #000;
    resize: vertical;
  }

  input[type=submit] {
    padding: 20px 40px;
  }
}

/* ==========================================================================
   BOTÃO DE SUBMIT DO FORMULÁRIO DE CONTATO (RODAPÉ)
   ========================================================================== */

/* 1. Estado Normal (Resting) */
#contato .wpcf7-form input[type="submit"].wpcf7-submit {
    color: #000000 !important;            /* Texto em preto */
    border: none !important;
    transition: all 0.3s ease !important;
}

/* 2. Estado Hover */
#contato .wpcf7-form input[type="submit"].wpcf7-submit:hover {
    cursor: pointer;
}