:root {
    --napi-green: #7A9651;
    --napi-green-dark: #586b39;
    --napi-beige: #F7F4EF;
    --napi-yellow: #E4B243;
}

/* Layout geral */

body {
    background-color: var(--napi-beige);
    font-family: "Source Sans 3", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    flex-grow: 1;
}

h1, h2, h3, h4, h5, h6,
.navbar-brand {
    font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ===== NAVBAR ===== */

.navbar {
    min-height: 86px;
}

.navbar-brand {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-weight: 600;
    color: var(--napi-green);
    position: relative;
}

.navbar-brand img {
    height: 52px;
    transition: transform .25s ease-out, filter .25s ease-out;
}

.brand-text {
    max-width: 0;
    opacity: 0;
    white-space: nowrap;
    overflow: hidden;
    color: var(--napi-green);
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    transform: translateY(2px);
    transition: max-width .45s ease, opacity .45s ease, margin-left .45s ease;
}

.navbar-brand:hover img {
    transform: scale(1.06);
    filter: drop-shadow(0 0 9px rgba(122,150,81,.5));
}

.navbar-brand:hover .brand-text {
    max-width: 450px;
    opacity: 1;
    margin-left: .25rem;
}

/* Links da navbar com efeito fill verde no hover */

.navbar-nav .nav-link {
    border-radius: 999px;
    padding: .45rem 1rem;
    background-image: linear-gradient(to right, var(--napi-green), var(--napi-green));
    background-size: 0% 100%;
    background-repeat: no-repeat;
    color: #444;
    transition: background-size .25s ease-out, color .2s ease-out;
}

.navbar-nav .nav-link:hover {
    background-size: 100% 100%;
    color: #fff !important;
}

.navbar-nav .nav-link:focus {
    box-shadow: none;
}

/* Toggler customizado */

.navbar-toggler.custom-toggler {
    border: none;
}

.navbar-toggler.custom-toggler:focus {
    box-shadow: none;
}

.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 100 80' width='28' height='28' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100' height='12' rx='6' fill='%237A9651'/%3E%3Crect y='30' width='100' height='12' rx='6' fill='%237A9651'/%3E%3Crect y='60' width='100' height='12' rx='6' fill='%237A9651'/%3E%3C/svg%3E");
}

/* Espaço padrão para compensar a navbar fixa */
.navbar-spacer {
    height: 110px;
}

/* ===== CARDS GERAIS ===== */

.card-section {
    background: #fff;
    border-radius: 14px;
    padding: 22px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.09);
}

/* ===== PERFIL DO PESQUISADOR ===== */

.profile-card {
    position: relative;
    padding-top: 80px;
    margin-top: 40px;
}

.profile-photo-wrapper {
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
}

.profile-photo-inner {
    position: relative;
    display: inline-block;
}

.profile-photo {
    width: 190px;
    height: 190px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #fff;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    transition: transform .25s ease-out, box-shadow .25s ease-out;
    display: block;
}

.profile-photo-inner:hover .profile-photo {
    transform: translateY(-4px);
    box-shadow: 0 0 0 4px var(--napi-beige), 0 8px 18px rgba(0,0,0,0.25);
}

.profile-zoom-icon {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(0,0,0,0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .2s ease-out;
}

.profile-zoom-icon i {
    color: #fff;
    font-size: 1.7rem;
}

.profile-photo-inner:hover .profile-zoom-icon {
    opacity: 1;
}

.profile-name-block {
    text-align: center;
    margin-top: 86px;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.profile-short-bio {
    font-size: 0.93rem;
}

/* Tags / chips */

.tag {
    background: var(--napi-green);
    color: #fff;
    padding: 4px 12px;
    font-size: 0.80rem;
    border-radius: 20px;
    margin: 2px 4px 2px 0;
    display: inline-block;
}

/* Botões de links do perfil */

.profile-links .btn {
    border-radius: 999px;
    font-size: 0.85rem;
}

.profile-links .btn-outline-success {
    border-color: var(--napi-green);
    color: var(--napi-green);
}

.profile-links .btn-outline-success:hover {
    background-color: var(--napi-green);
    color: #fff;
}

/* ===== TABELA DE PUBLICAÇÕES ===== */

.table-hover tbody tr:hover {
    background-color: #EFECE6 !important;
}

.table-publications th:nth-child(1),
.table-publications td:nth-child(1) {
    width: 45%;  /* Título */
}

.table-publications th:nth-child(2),
.table-publications td:nth-child(2) {
    width: 13%;  /* Tipo */
    white-space: nowrap;
}

.table-publications th:nth-child(3),
.table-publications td:nth-child(3) {
    width: 8%;   /* Ano */
    white-space: nowrap;
}

.table-publications th:nth-child(4),
.table-publications td:nth-child(4) {
    width: 19%;  /* Autores */
}

.table-publications th:nth-child(5),
.table-publications td:nth-child(5) {
    width: 15%;  /* Ações */
    white-space: nowrap;
}

.hover-link {
    text-decoration: none;
    color: inherit;
    transition: color .2s ease-out;
}

.hover-link:hover {
    color: var(--napi-green) !important;
}

/* Avatares dos autores (links para o perfil) */

.avatar-group {
    display: flex;
    align-items: center;
}

.avatar-group .author-link {
    display: inline-block;
    margin-left: -8px;
    border-radius: 50%;
}

.avatar-group .author-link:first-child {
    margin-left: 0;
}

.avatar-group .author-link img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    cursor: pointer;
    transition: transform .15s ease-out;
}

.avatar-group .author-link:hover img {
    transform: translateY(-3px) scale(1.07);
}

.avatar-group .more {
    font-size: .8rem;
    margin-left: 4px;
    color: #666;
}

/* Popover dos autores */

.popover {
    max-width: 260px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}

.popover-header {
    font-weight: 600;
    font-size: 0.85rem;
    background-color: var(--napi-beige);
}

.popover-body {
    font-size: 0.82rem;
    text-align: center;
}

.popover-body img {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 0 auto .5rem !important;
}

/* Modal de referência */

.modal-reference .modal-dialog {
    max-width: 420px;
    margin: 1.75rem auto;
}

.modal-reference .modal-content {
    padding: 1.5rem;
}

.modal-reference p {
    text-wrap: wrap;
    font-size: 0.92rem;
}

/* Botões de ação */

.actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
}

.action-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .2s ease-out, transform .2s ease-out;
}

.action-icon i {
    transition: transform .2s ease-out, color .2s ease-out;
}

.action-icon.eye:hover {
    background-color: var(--napi-green);
}

.action-icon.ref:hover {
    background-color: var(--napi-yellow);
}

.action-icon:hover i {
    color: #fff !important;
    transform: translateY(-2px);
}

/* Textos justificados em blocos de conteúdo */

.profile-short-bio,
.card-section p {
    text-align: justify;
}

/* ===== FOOTER ===== */

footer {
    font-size: 0.85rem;
    background-color: #fff;
}

/* ===== RESPONSIVO (MOBILE) ===== */

@media (max-width: 768px) {

    .navbar .container {
        justify-content: center;
        position: relative;
    }

    .navbar-toggler {
        position: absolute;
        right: 1rem;
    }

    .navbar-brand {
        margin: 0 auto;
    }

    /* some COMPLETAMENTE o texto do lado do logo no mobile */
    .brand-text {
        display: none !important;
        max-width: 0 !important;
        opacity: 0 !important;
        margin-left: 0 !important;
    }

    .navbar-brand:hover .brand-text {
        display: none !important;
    }

    .navbar-collapse {
        text-align: center;
    }

    .navbar-nav {
        width: 100%;
        align-items: center !important;
    }

    .navbar-nav .nav-link {
        display: inline-block;
    }

    .profile-card {
        margin-top: 25px;
        padding-top: 80px;
    }

    .profile-name-block {
        margin-top: 90px;
    }
}


/* =========================================================



   QUEM SOMOS — GRID DE PESQUISADORES



   ========================================================= */

.team-intro {
    max-width: 720px;
    margin: 0 auto 2rem auto;
    text-align: center;
}

.team-intro p {
    text-align: center;
}

.team-filter-nav {
    margin-bottom: 1.5rem;
}

.team-filter-nav .nav-link {
    border-radius: 999px;
    padding: .4rem 1rem;
    font-size: 0.9rem;
    color: #444;
    border: 1px solid transparent;
}

.team-filter-nav .nav-link.active,
.team-filter-nav .nav-link:hover {
    background-color: var(--napi-green);
    color: #fff !important;
    border-color: var(--napi-green);
}

/* LINK QUE ENVOLVE O CARD TODO */
.person-card-link {
    text-decoration: none;
    color: inherit;
}

/* CARD – fundo transparente e espaço pro avatar “invadir” */
.person-card {
    background: transparent;
    border-radius: 16px;
    padding: 104px 18px 32px;  /* topo um pouco menor -> nome mais perto da foto */
    margin-top: 78px;
    margin-bottom: 40px;
    text-align: center;
    transition: transform .22s ease-out,
                background-color .25s ease-out,
                box-shadow .22s ease-out;
    position: relative;
    overflow: visible;
}

/* HOVER: fundo aparece e ganha sombra */
.person-card:hover {
    background-color: #ffffff;
    box-shadow: 0 10px 26px rgba(0,0,0,0.12);
    transform: translateY(-4px);
}

/* AVATAR MAIOR, SALTANDO PRA FORA DO CARD */
.person-avatar-wrapper {
    position: absolute;
    top: -70px;
    left: 50%;
    transform: translateX(-50%);
    width: 150px;            /* anel externo */
    height: 150px;
    border-radius: 50%;
    padding: 5px;
    background: linear-gradient(135deg, var(--napi-green), var(--napi-yellow));
    display: flex;
    align-items: center;
    justify-content: center;
}

.person-avatar {
    width: 100%;             /* ≈ 140px internos */
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    background-color: #fff;
}

/* TEXTOS */
.person-name {
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.person-role {
    font-size: 0.86rem;
    color: #666;
}

/* TAGS */
.person-chip {
    display: inline-block;
    padding: 3px 11px;
    border-radius: 999px;
    background-color: rgba(122,150,81,0.14);
    color: #4e5b37;
    font-size: 0.74rem;
    margin: 3px 4px;
}

/* responsivo */
@media (max-width: 576px) {
    .person-card {
        padding: 96px 14px 28px;
        margin-top: 72px;
    }

    .person-avatar-wrapper {
        width: 140px;
        height: 140px;
        top: -64px;
    }
}

/* =========================================================
   
PÁGINA DE PUBLICAÇÕES

   ========================================================= */

.pub-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: 1rem;
    font-size: 0.9rem;
}

.pub-pagination .info {
    color: #666;
}

.pub-pagination .pagination {
    margin-bottom: 0;
}

.pub-pagination .page-link {
    border-radius: 999px;
    font-size: 0.85rem;
    padding: 0.25rem 0.65rem;
}

.pub-pagination .page-link:focus {
    box-shadow: 0 0 0 0.15rem rgba(122,150,81,0.25);
}

.pub-pagination .page-item.active .page-link {
    background-color: var(--napi-green);
    border-color: var(--napi-green);
}

/* ===== PÁGINA DE PUBLICAÇÕES (publicacoes.php) ===== */

/* título + textinho introdutório */
.page-publicacoes .pub-intro {
    max-width: 780px;
    margin: 0 auto 2rem auto;
    text-align: center;
}

.page-publicacoes .pub-intro p {
    text-align: center;
}

/* card dos filtros (parte de cima) */
.page-publicacoes .pub-filters-card {
    margin-bottom: 0; /* espaço vai ser dado pela lista logo abaixo */
}

/* inputs/selects dos filtros */
.page-publicacoes .pub-filters .form-control,
.page-publicacoes .pub-filters .form-select {
    font-size: 0.9rem;
    border-radius: 999px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.page-publicacoes .pub-filters .form-control:focus,
.page-publicacoes .pub-filters .form-select:focus {
    box-shadow: 0 0 0 0.15rem rgba(122,150,81,0.25);
    border-color: var(--napi-green);
}

/* botão limpar */
.page-publicacoes .pub-filters .btn-outline-secondary {
    border-radius: 999px;
    font-size: 0.85rem;
}

/* card da tabela logo abaixo dos filtros,
   só pra criar aquele "respiro" entre eles */
.page-publicacoes .pub-list-card {
    margin-top: 0.9rem;
}

/* Larguras APENAS na página de publicações */
.page-publicacoes .table-publications th:nth-child(1),
.page-publicacoes .table-publications td:nth-child(1) {
    width: 55%;  /* mais espaço para título */
}

.page-publicacoes .table-publications th:nth-child(2),
.page-publicacoes .table-publications td:nth-child(2) {
    width: 12%;  /* tipo */
    white-space: nowrap;
}

.page-publicacoes .table-publications th:nth-child(3),
.page-publicacoes .table-publications td:nth-child(3) {
    width: 10%;  /* data */
    white-space: nowrap;
}

.page-publicacoes .table-publications th:nth-child(4),
.page-publicacoes .table-publications td:nth-child(4) {
    width: 13%;  /* autores — reduzido */
}

.page-publicacoes .table-publications th:nth-child(5),
.page-publicacoes .table-publications td:nth-child(5) {
    width: 10%;  /* ações — reduzido */
    white-space: nowrap;
}

/* botão "Sugerir publicação" lá embaixo */

.btn-sugerir {
    border-radius: 999px;
    font-size: 0.9rem;
    padding: 0.4rem 1.2rem;
    background-color: var(--napi-green);
    border-color: var(--napi-green);
    color: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
    transition:
        background-color .2s ease-out,
        border-color .2s ease-out,
        transform .15s ease-out,
        box-shadow .15s ease-out;
}

.btn-sugerir:hover {
    background-color: var(--napi-green-dark);
    border-color: var(--napi-green-dark);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(0,0,0,0.18);
}

.pub-suggest-text {
    font-size: 0.9rem;
    color: #555;
}

/* Melhor distribuição dos filtros */
.page-publicacoes .pub-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-publicacoes .pub-filters .search-col {
    flex: 1 1 320px;
}

.page-publicacoes .pub-filters .type-col,
.page-publicacoes .pub-filters .year-col {
    flex: 0 1 180px;
}

.page-publicacoes .pub-filters .clear-col {
    flex: 0 1 150px;
    display: flex;
    justify-content: center;
}

/* =========================================================
   PÁGINA DE NOTÍCIAS (noticias.php)
   ========================================================= */

.page-noticias .news-intro {
    max-width: 780px;
    margin: 0 auto 2rem auto;
    text-align: center;
}

.page-noticias .news-intro p {
    text-align: center;
}

/* HERO PRINCIPAL */

.news-hero-card {
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
}

.news-hero-image-wrapper {
    overflow: hidden;
    border-radius: 18px 18px 0 0;
}

.news-hero-image {
    width: 100%;
    height: 260px;
    object-fit: cover;
    transition: transform .4s ease-out;
}

.news-hero-card:hover .news-hero-image {
    transform: scale(1.04);
}

.news-hero-body {
    padding: 18px 22px 20px;
}

.news-tag {
    display: inline-block;
    padding: 3px 11px;
    border-radius: 999px;
    background-color: rgba(122,150,81,0.14);
    color: #4e5b37;
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.4rem;
}

.news-hero-title {
    font-size: 1.4rem;
    margin-bottom: 0.25rem;
}

.news-meta {
    font-size: 0.85rem;
    color: #777;
}

.news-hero-resumo {
    margin-top: 0.4rem;
    margin-bottom: 0.6rem;
    text-align: justify;
}

.news-hero-btn {
    border-radius: 999px;
}

/* DESTAQUES SECUNDÁRIOS (2 cards) */

.news-highlight-link {
    text-decoration: none;
    color: inherit;
}

.news-highlight-card {
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.news-highlight-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.12);
}

.news-highlight-image-wrapper {
    overflow: hidden;
}

.news-highlight-image {
    width: 100%;
    height: 180px;
    object-fit: cover;
    transition: transform .35s ease-out;
}

.news-highlight-card:hover .news-highlight-image {
    transform: scale(1.04);
}

.news-highlight-body {
    padding: 14px 16px 16px;
}

.news-highlight-title {
    font-size: 1.05rem;
    margin-bottom: .15rem;
}

.news-highlight-resumo {
    font-size: 0.9rem;
    margin-bottom: 0;
    text-align: justify;
}

/* LISTA DE NOTÍCIAS ANTERIORES */

.news-list {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.news-list-item + .news-list-item {
    border-top: 1px solid rgba(0,0,0,0.05);
    padding-top: 1rem;
}

.news-list-thumb {
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 12px;
}

.news-list-title-link {
    text-decoration: none;
    color: inherit;
}

.news-list-title-link:hover .news-list-title {
    color: var(--napi-green);
}

.news-list-title {
    font-size: 0.98rem;
}

.news-list-resumo {
    font-size: 0.9rem;
    text-align: justify;
}

/* Responsivo notícias */

@media (max-width: 767.98px) {
    .news-hero-image {
        height: 210px;
    }

    .news-highlight-image {
        height: 170px;
    }

    .news-list-thumb {
        height: 180px;
        margin-bottom: .35rem;
    }
}

/* =========================================================
   PÁGINA DA NOTÍCIA (noticia.php)
   ========================================================= */

.news-back-link {
    text-decoration: none;
    font-size: 0.9rem;
    color: var(--napi-green-dark);
}

.news-back-link i {
    vertical-align: -1px;
}

.news-back-link:hover {
    text-decoration: underline;
}

.news-article-card {
    border-radius: 18px;
}

.news-article-image-wrapper {
    overflow: hidden;
    border-radius: 14px;
}

.news-article-image {
    width: 100%;
    max-height: 320px;
    object-fit: cover;
    display: block;
}

.news-article-title {
    font-size: 1.6rem;
    margin-bottom: 0.25rem;
}

.news-article-body p {
    text-align: justify;
}

/* Leia também */

.news-related-link {
    text-decoration: none;
    color: inherit;
}

.news-related-card {
    padding: 14px 14px 16px;
    border-radius: 16px;
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.news-related-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.news-related-image {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 12px;
}

.news-related-title {
    font-size: 0.95rem;
}

/* =========================================================
   PÁGINA DE CONTATO (contato.php)
   ========================================================= */

.page-contato .contact-intro {
    max-width: 720px;
    margin: 0 auto 2rem auto;
    text-align: center;
}

.page-contato .contact-intro p {
    text-align: center;
}

/* animação suave de entrada */

@keyframes fadeUp-soft {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.contact-animate-left,
.contact-animate-right,
.contact-animate-bottom {
    opacity: 0;
    animation: fadeUp-soft .6s ease-out forwards;
}

.contact-animate-left {
    animation-delay: .05s;
}

.contact-animate-right {
    animation-delay: .12s;
}

.contact-animate-bottom {
    animation-delay: .18s;
}

.contact-animate-bottom.delay-1 {
    animation-delay: .24s;
}

/* MAPA + ENDEREÇO */

.contact-map-card {
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.contact-map-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.10);
}

.contact-map-wrapper {
    border-radius: 14px;
    overflow: hidden;
    background-color: #ddd;
}

.contact-map-wrapper iframe {
    border: 0;
    width: 100%;
    height: 260px;
    display: block;
}

.contact-address-block {
    margin-top: .5rem;
}

/* Ícone redondo reaproveitado */

.contact-icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background-color: rgba(122,150,81,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-icon i {
    color: var(--napi-green);
    font-size: 1.1rem;
}

/* FORMULÁRIO */

.contact-form-card {
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.contact-form-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.10);
}

.contact-form-card .form-label {
    font-size: 0.9rem;
    font-weight: 500;
}

.contact-form-card .form-control,
.contact-form-card .form-select {
    font-size: 0.9rem;
}

.contact-submit-btn {
    border-radius: 999px;
    padding-inline: 1.4rem;
}

.contact-submit-btn i {
    font-size: 0.95rem;
}

/* E-MAIL + REDES (cards de baixo) */

.contact-info-card {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    height: 100%;
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.contact-info-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.10);
}

.contact-email-link {
    text-decoration: none;
    color: var(--napi-green-dark);
}

.contact-email-link:hover {
    text-decoration: underline;
}

/* Pílulas de redes sociais */

.social-pill {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: 4px 10px;
    border-radius: 999px;
    background-color: rgba(0,0,0,0.03);
    font-size: 0.8rem;
    color: #555;
    transition: background-color .18s ease-out, transform .18s ease-out;
}

.social-pill i {
    font-size: 0.9rem;
}

.social-pill:hover {
    background-color: rgba(122,150,81,0.12);
    transform: translateY(-1px);
}

/* Responsivo */

@media (max-width: 767.98px) {

    .contact-map-wrapper iframe {
        height: 220px;
    }

    .contact-info-card {
        align-items: flex-start;
    }
}

/* =========================================================
   SOBRE NÓS
   ========================================================= */

/* Cabeçalho da página */
.page-sobre .page-header {
    margin-bottom: 1.75rem;
}

.page-sobre .page-title {
    font-size: 2.2rem;
}

.page-sobre .page-subtitle {
    max-width: 720px;
    margin-top: .35rem;
    color: #555;
}

/* HERO – "Nossa essência" com fundo animado */
.about-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2rem;
}

/* lado do texto */
.about-hero-text {
    flex: 1 1 260px;
}

/* bolhas animadas no fundo */
.about-hero::before,
.about-hero::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    filter: blur(32px);
    opacity: 0.45;
    z-index: 0;
}

.about-hero::before {
    width: 320px;
    height: 320px;
    background: radial-gradient(circle at 30% 30%, #e4b243 0, #f7f4ef 55%, transparent 70%);
    top: -90px;
    right: -80px;
    animation: napiBlob1 18s ease-in-out infinite alternate;
}

.about-hero::after {
    width: 260px;
    height: 260px;
    background: radial-gradient(circle at 20% 80%, #7a9651 0, #f7f4ef 60%, transparent 70%);
    bottom: -80px;
    left: -40px;
    animation: napiBlob2 22s ease-in-out infinite alternate;
}

@keyframes napiBlob1 {
    0%   { transform: translate(0,0) scale(1);   opacity: .45; }
    50%  { transform: translate(-20px,20px) scale(1.08); opacity: .6; }
    100% { transform: translate(10px,-10px) scale(.98);  opacity: .4; }
}

@keyframes napiBlob2 {
    0%   { transform: translate(0,0) scale(1);   opacity: .35; }
    50%  { transform: translate(20px,-15px) scale(1.05); opacity: .5; }
    100% { transform: translate(-10px,10px) scale(.96);  opacity: .3; }
}

/* container visual do hero (pra não ficar a ilustração “solta”) */
.about-hero-visual {
    position: relative;
    z-index: 1;
    flex: 0 0 260px;
    display: flex;
    justify-content: center;
}

.about-hero-visual-inner {
    position: relative;
    width: 220px;
    height: 220px;
    border-radius: 32px;
    background: rgba(255,255,255,0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0,0,0,0.04);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 28px rgba(0,0,0,0.12);
}

/* texto dentro do hero sempre acima das bolhas */
.about-hero,
.about-hero * {
    position: relative;
    z-index: 1;
}

/* =========================================================
   HISTÓRIA / TIMELINE
   ========================================================= */

.about-history {
    position: relative;
}

.about-history-highlight {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .18rem .7rem;
    border-radius: 999px;
    background: rgba(122,150,81,0.08);
    color: #4e5b37;
    font-size: 0.8rem;
    margin-bottom: .75rem;
}

.about-timeline {
    margin-top: 1.2rem;
    padding-left: 1.5rem;
    position: relative;
}

.about-timeline::before {
    content: "";
    position: absolute;
    left: .45rem;
    top: 0.3rem;
    bottom: 0.4rem;
    width: 2px;
    background: linear-gradient(
        180deg,
        rgba(122,150,81,0.2) 0%,
        rgba(122,150,81,0.45) 40%,
        rgba(228,178,67,0.55) 80%,
        rgba(228,178,67,0.2) 100%
    );
    border-radius: 999px;
    transform: skewX(-6deg);
}

.timeline-item {
    position: relative;
    margin-bottom: 1.3rem;
    padding-left: 1.4rem;
}

.timeline-marker {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: #FFF7E0;
    border: 2px solid var(--napi-yellow);
    box-shadow: 0 0 0 2px #fff;
    margin-top: .25rem;          /* alinha no eixo vertical */
    flex-shrink: 0;
}

.timeline-item h5 {
    font-size: 0.98rem;
    margin-bottom: .15rem;
}

.timeline-item p {
    font-size: 0.9rem;
    margin-bottom: 0;
}

/* leve “onda” alternando um pouco o recuo do texto */
.timeline-item:nth-child(even) {
    transform: translateX(4px);
}
.timeline-item:nth-child(odd) {
    transform: translateX(-2px);
}

/* ===== SIMBOLISMO DO GIRASSOL ===== */

.symbol-block {
    background-color: #faf7f1;
    border-radius: 14px;
    padding: 14px 16px 16px;
    height: 100%;
    transition:
        transform .18s ease-out,
        box-shadow .18s ease-out,
        background-color .18s ease-out;
}

.symbol-block h5 {
    margin-bottom: .35rem;
}

.symbol-block p {
    font-size: 0.92rem;
}

.symbol-block:hover {
    background-color: #ffffff;
    transform: translateY(-4px);
    box-shadow: 0 8px 22px rgba(0,0,0,0.10);
}

/* =========================================================
   SOBRE NÓS — POR QUE UM GIRASSOL?
   ========================================================= */

/* Container do logo */
.logo-orbit {
    position: relative;
    display: inline-block;
    padding: 0;
    margin-top: 1rem;
    text-align: center;
}

/* Logo animado suave */
.logo-orbit-img {
    max-width: 260px;
    width: 100%;
    filter: drop-shadow(0 6px 22px rgba(0,0,0,0.18));
    transition: transform .25s ease-out, filter .25s ease-out;
}

.logo-orbit-img:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 10px 28px rgba(0,0,0,0.28));
}

/* Cards simbólicos */
.symbol-block {
    background-color: #faf7f1;
    border-radius: 16px;
    padding: 16px 18px 18px;
    height: 100%;
    transition:
        transform .22s ease-out,
        box-shadow .22s ease-out,
        background-color .22s ease-out;
}

.symbol-block h5 {
    margin-bottom: .35rem;
}

.symbol-block p {
    font-size: 0.92rem;
}

.symbol-block:hover {
    background-color: #ffffff;
    transform: translateY(-5px);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

/* Ajustes responsivos */
@media (max-width: 992px) {
    .logo-orbit-img {
        max-width: 220px;
    }
}

@media (max-width: 576px) {
    .logo-orbit-img {
        max-width: 180px;
    }
}
/* LINHAS DE PESQUISA (placeholder por enquanto) */

.research-lines-placeholder p {
    max-width: 600px;
    margin: 0.25rem auto 0 auto;
}

/* Responsivo: hero empilha melhor */
@media (max-width: 768px) {
    .about-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .about-hero-visual {
        width: 100%;
        justify-content: center;
    }

    .about-hero-visual-inner {
        width: 200px;
        height: 200px;
    }
}

/* =========================================================
   SOBRE NÓS — LINHAS DE PESQUISA
   ========================================================= */

.napi-chip-total {
    background-color: rgba(122,150,81,0.12);
    color: var(--napi-green-dark);
    font-weight: 500;
}

.napi-chip {
    background-color: rgba(122,150,81,0.14);
    color: var(--napi-green-dark);
    font-weight: 500;
}

.research-accordion .accordion-item {
    border-radius: 14px;
    overflow: hidden;
    border: none;
    box-shadow: 0 3px 10px rgba(0,0,0,0.03);
    margin-bottom: .75rem;
}

.research-accordion .accordion-item:last-child {
    margin-bottom: 0;
}

.research-accordion .accordion-button {
    background-color: #faf7f1;
    font-weight: 500;
    padding-top: .85rem;
    padding-bottom: .85rem;
    gap: .75rem;
}

.research-accordion .accordion-button:not(.collapsed) {
    background-color: #fff;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.05);
}

.research-accordion .accordion-button:focus {
    box-shadow: 0 0 0 0.15rem rgba(122,150,81,0.25);
}

.research-accordion .accordion-body {
    background-color: #fff;
    font-size: 0.93rem;
}

.linha-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--napi-green), var(--napi-yellow));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}

.linha-icon i {
    font-size: 1.1rem;
}

.linha-titulo {
    display: block;
    font-weight: 600;
}

.linha-subchips {
    margin-top: 2px;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    font-size: 0.78rem;
}

/* mobile */
@media (max-width: 576px) {
    .napi-chip-total {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}

/* =========================================================
   SOBRE NÓS — HERO ANIMADO COM GIRASSOL
   ========================================================= */

.hero-napi {
    border-radius: 22px;
    padding: 0;
    background-color: #000;          /* fallback enquanto a animação carrega */
    position: relative;
    overflow: hidden;
}


/* NOVO: vinheta nos cantos */
.hero-napi::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    /* quatro “manchas” escuras nos cantos */
    background:
        radial-gradient(circle at 15% 0%,   rgba(0,0,0,0.55) 0, transparent 45%),
        radial-gradient(circle at 85% 0%,   rgba(0,0,0,0.55) 0, transparent 45%),
        radial-gradient(circle at 0% 100%,  rgba(0,0,0,0.60) 0, transparent 45%),
        radial-gradient(circle at 100% 100%,rgba(0,0,0,0.60) 0, transparent 45%);
    z-index: 2;
}

/* wrapper onde o p5 desenha o canvas */
.hero-canvas-wrapper {
    position: absolute;
    inset: 0;
    z-index: 1;              /* fica por baixo da vinheta e do conteúdo */
    height: 320px;
}

/* conteúdo por cima da animação */
.hero-napi-content {
    position: relative;
    z-index: 3;              /* sobe 1 nível por causa da ::before */
    padding: 28px 28px 26px;
    color: #fff;
    background: linear-gradient(
        120deg,
        rgba(0,0,0,0.78) 0%,
        rgba(0,0,0,0.55) 45%,
        rgba(0,0,0,0.35) 70%,
        rgba(0,0,0,0.15) 100%
    );
}

.hero-napi .page-title {
    color: #fff;
}

.hero-napi .page-subtitle {
    color: #f5f2e8;
}

.hero-napi-resumo {
    font-size: 0.96rem;
}

/* caixinha com chip + botão CNPq */
.hero-napi-chipbox .napi-chip-total {
    background-color: rgba(250, 247, 240, 0.17);
    color: #f7f4ef;
    border: 1px solid rgba(247,244,239,0.35);
}

.hero-napi-link {
    border-radius: 999px;
    border-width: 1px;
    font-size: 0.82rem;
}

.hero-napi-link:hover {
    background-color: #fff;
    color: var(--napi-green-dark);
}

/* Ajustes responsivos */
@media (max-width: 992px) {
    .hero-canvas-wrapper {
        height: 360px;
    }
    .hero-napi-content {
        padding: 22px 18px 20px;
    }
}

@media (max-width: 576px) {
    .hero-canvas-wrapper {
        height: 380px;
    }
    .hero-napi-content {
        text-align: center;
    }
    .hero-napi-chipbox {
        align-items: center !important;
    }
}

 /* ================================
   SOBRE NÓS — HISTÓRIA + LINHA DO TEMPO
   ================================ */

.about-history {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
}

/* Fundo suave na metade direita */
.about-history::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 50%;
    background-color: #F3EFE6;
    z-index: 0;
}

/* Conteúdo da esquerda/direita acima do fundo */
.history-text,
.history-timeline {
    position: relative;
    z-index: 1;
}

/* Coluna da história */
.history-text {
    padding: 2.3rem 2.6rem 2.3rem 2.6rem;
}

.history-text p {
    margin-bottom: 1rem;
    line-height: 1.55;
}

/* Coluna da timeline */
.history-timeline {
    padding: 2.3rem 2.8rem 2.3rem 2.6rem;
}

/* Título da timeline – mais leve */
.history-timeline h3 {
    margin-bottom: 1.2rem;
    font-weight: 500;
    font-size: 1.2rem;
    padding-left: 3.2rem;
}

/* LISTA */
.timeline-list {
    position: relative;
    padding-left: 2rem;   /* afasta um pouco do título */
}

/* Linha vertical fina e elegante */
.timeline-list::before {
    content: "";
    position: absolute;
    top: 0.5rem;
    bottom: 0.5rem;
    left: 0.7rem;
    width: 2px;
    background: rgba(122,150,81,0.45);
    border-radius: 999px;
}

/* ITEM */
.timeline-item {
    position: relative;
    padding-left: 0.5rem;   /* menos recuo, mais alinhado */
    padding-bottom: 1.3rem; /* eventos mais próximos */
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
}

/* Último item sem espaço extra */
.timeline-item:last-child {
    padding-bottom: 0;
}

/* MARCADOR */
.timeline-marker {
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 50%;
    background: #FFF7E0;
    border: 3px solid var(--napi-yellow);
    box-shadow: 0 0 0 2px #fff;
    flex-shrink: 0;
}

/* TÍTULO DO EVENTO */
.timeline-content h5 {
    margin: 0;
    font-size: 1.02rem;
}

/* TEXTO */
.timeline-content p {
    margin: 0.25rem 0 0 0;
    font-size: 0.9rem;
    color: #444;
}

/* RESPONSIVO */
@media (max-width: 992px) {
    .about-history::after {
        width: 100%;
        top: 50%;
    }

    .history-text,
    .history-timeline {
        padding: 1.9rem 1.5rem;
    }
}

@media (max-width: 576px) {
    .timeline-list {
        padding-left: 1.7rem;
    }

    .history-timeline {
        padding-left: 1.9rem;
    }
}

/* =========================================================
   HOME — HERO CAROUSEL
   ========================================================= */

.hero-carousel {
    border-radius: 22px;
    background-color: #000;
}

.hero-slide {
    position: relative;
}

.hero-slide-img {
    width: 100%;
    height: 430px;              /* altura A */
    object-fit: cover;
}

.hero-slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        120deg,
        rgba(0,0,0,0.80) 0%,
        rgba(0,0,0,0.55) 40%,
        rgba(0,0,0,0.25) 70%,
        rgba(0,0,0,0.10) 100%
    );
    z-index: 1;
}

.hero-slide-content {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    padding: 26px 30px;
    color: #fff;
}

.hero-slide-text {
    max-width: 640px;
}

.hero-pill {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .18rem .7rem;
    border-radius: 999px;
    background: rgba(247,244,239,0.20);
    color: #f7f4ef;
    font-size: 0.8rem;
    margin-bottom: .6rem;
}

.hero-title {
    font-size: 1.75rem;
    margin-bottom: .4rem;
}

.hero-subtitle {
    font-size: 0.97rem;
    color: #f3efe4;
    margin-bottom: .75rem;
}

/* Botões do hero */
.hero-btn-primary {
    border-radius: 999px;
    padding-inline: 1.3rem;
    font-weight: 500;
}

.hero-btn-secondary {
    border-radius: 999px;
    padding-inline: 1.1rem;
}

/* Indicadores */
.hero-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background-color: rgba(255,255,255,0.55);
    border: none;
    margin: 0 3px;
}

.hero-indicators .active {
    width: 18px;
    background-color: #fff;
}

/* Controles */
.hero-control-icon {
    filter: drop-shadow(0 0 4px rgba(0,0,0,0.7));
}

/* Responsivo hero */
@media (max-width: 768px) {
    .hero-slide-img {
        height: 360px;
    }
    .hero-slide-content {
        padding: 18px 16px;
        align-items: flex-end;
    }
    .hero-title {
        font-size: 1.4rem;
    }
    .hero-subtitle {
        font-size: 0.9rem;
    }
}

/* =========================================================
   HOME — PILARES
   ========================================================= */

.home-pillar {
    height: 100%;
    transition: transform .22s ease-out, box-shadow .22s ease-out, background-color .22s ease-out;
}

.pillar-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--napi-green), var(--napi-yellow));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-bottom: .4rem;
}

.pillar-icon i {
    font-size: 1.3rem;
}

.pillar-link {
    font-size: 0.86rem;
    text-decoration: none;
    color: var(--napi-green-dark);
    font-weight: 500;
}

.pillar-link i {
    vertical-align: middle;
}

.home-pillar:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

/* =========================================================
   HOME — NOTÍCIAS
   ========================================================= */

.bg-napi-soft {
    background-color: rgba(122,150,81,0.14);
    color: var(--napi-green-dark);
}

.home-news-main {
    height: 100%;
}

.home-news-image-wrapper {
    border-radius: 14px;
    overflow: hidden;
    height: 100%;
}

.home-news-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.03);
    transition: transform .25s ease-out;
}

.home-news-main:hover .home-news-image {
    transform: scale(1.08);
}

.home-news-excerpt {
    font-size: 0.92rem;
    margin-top: .3rem;
}

.home-news-link {
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--napi-green-dark);
}

.home-news-link:hover {
    color: var(--napi-green);
}

.home-news-secondary {
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.home-news-secondary:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(0,0,0,0.10);
}

.home-news-thumb-wrapper {
    width: 82px;
    height: 82px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
}

.home-news-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =========================================================
   HOME — DESTAQUES: PESQUISADORES & PUBLICAÇÕES
   ========================================================= */

.border-lg-end {
    border-right: 1px solid rgba(0,0,0,0.06);
}

@media (max-width: 992px) {
    .border-lg-end {
        border-right: none;
        border-bottom: 1px solid rgba(0,0,0,0.06);
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }
}

.home-avatar-row {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.home-avatar-link {
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px rgba(122,150,81,0.35);
    width: 40px;
    height: 40px;
    transition: transform .16s ease-out, box-shadow .16s ease-out;
}

.home-avatar-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-avatar-link:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 0 0 3px rgba(122,150,81,0.55);
}

.home-avatar-more {
    font-size: 0.85rem;
    color: #666;
}

.home-pubs-list li {
    margin-bottom: .55rem;
}

.home-pub-link {
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 500;
    color: #333;
}

.home-pub-link:hover {
    color: var(--napi-green-dark);
}

.home-pub-meta {
    display: block;
    font-size: 0.8rem;
    color: #777;
}

/* =========================================================
   HOME — CHAMADA & LINKS
   ========================================================= */

.home-callout-label {
    font-size: 0.82rem;
    color: var(--napi-green-dark);
}

.home-link-btn {
    display: inline-flex;
    align-items: center;
}

.home-quick-contact .home-contact-link {
    text-decoration: none;
    color: var(--napi-green-dark);
}

.home-quick-contact .home-contact-link:hover {
    color: var(--napi-green);
}

/* Autores nas publicações recentes da home */

.home-pub-authors {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.1rem;
}

.home-avatar-link.home-avatar-sm {
    width: 28px;
    height: 28px;
    box-shadow: 0 0 0 1px rgba(122,150,81,0.35);
}

.home-pub-more {
    font-size: 0.8rem;
    color: #777;
}


/* Home – destaque equipe & publicações */
.home-highlight-section .home-highlight-left {
    border-right: 1px solid rgba(0,0,0,0.06);
    padding-right: 1.75rem;
}

.home-highlight-section .home-highlight-right {
    padding-left: 1.75rem;
}

/* avatarzinhos na lista de publicações recentes */
.home-pub-authors {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.1rem;
}

.home-avatar-link.home-avatar-sm {
    width: 28px;
    height: 28px;
    box-shadow: 0 0 0 1px rgba(122,150,81,0.35);
}

.home-pub-more {
    font-size: 0.8rem;
    color: #777;
}

/* Links úteis aproveitando largura, com botões mais "clicáveis" */
.home-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
}

.home-link-btn:hover {
    background-color: var(--napi-green);
    color: #fff;
}

/* Ajustes responsivos pra não ficar apertado no mobile */
@media (max-width: 991.98px) {
    .home-highlight-section .home-highlight-left {
        border-right: none;
        padding-right: 0;
        margin-bottom: 1.5rem;
    }

    .home-highlight-section .home-highlight-right {
        padding-left: 0;
    }
}

/* Link de voltar no perfil do pesquisador */
.profile-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.9rem;
    color: var(--napi-green-dark);
    text-decoration: none;
    border-radius: 999px;
    padding: 0.25rem 0.85rem;
    background-color: transparent;
    border: 1px solid transparent;
    transition:
        background-color .18s ease-out,
        border-color .18s ease-out,
        color .18s ease-out,
        transform .15s ease-out;
}

.profile-back-link i {
    font-size: 0.95rem;
    vertical-align: -1px;
}

.profile-back-link:hover {
    background-color: rgba(122,150,81,0.12);
    border-color: rgba(122,150,81,0.45);
    color: var(--napi-green-dark);
    transform: translateY(-1px);
}

/* Badge de linha de pesquisa no perfil – permite quebrar linha dentro da pílula */
.profile-card .badge-line {
    white-space: normal;      /* remove o nowrap do Bootstrap */
    text-align: left;
    line-height: 1.3;
    max-width: 100%;          /* não ultrapassa o card */
    display: inline-block;    /* mantém a carinha de “pílula” */
}

/* -----------------------------
   Seção inferior da notícia
--------------------------------*/

/* Títulos das seções ("Leia também", "Links importantes", etc.) */
.page-noticia h5.fw-bold {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    color: #0b3c59;
    letter-spacing: 0.3px;
}

/* Links importantes */
.news-important-link {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 8px;
    background: #f7fafc;
    border: 1px solid #e2e8f0;
    transition: all .2s ease;
    font-size: 0.9rem;
}

.news-important-link:hover {
    background: #edf2f7;
    border-color: #cbd5e0;
    text-decoration: none;
}

/* Lista de links */
.list-unstyled li {
    margin-bottom: .5rem;
}

/* Pesquisadores relacionados */
.pesq-tag {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: .15s;
}

.pesq-tag:hover {
    background: #edf2f7 !important;
    transform: translateY(-1px);
}

/* Avatar */
.pesq-tag img {
    width: 32px;
    height: 32px;
}

/* Cards das notícias relacionadas */
.news-related-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    transition: all .2s ease;
    height: 100%;
}

.news-related-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
}

/* Imagens na seção "Leia também" */
.news-related-image {
    border-radius: 10px;
    height: 150px;
    object-fit: cover;
    width: 100%;
}

/* Título compacto */
.news-related-title {
    font-size: 0.92rem;
    line-height: 1.3;
    color: #1a202c;
}

/* Data */
.news-meta {
    font-size: 0.75rem;
    color: #718096;
}

/* Tag da categoria */
.news-tag {
    background: #0b3c59;
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.72rem;
    letter-spacing: 0.4px;
}

/* =========================================================
   NOTÍCIA — SEÇÃO INFERIOR (links, pesquisadores, relacionados)
   ========================================================= */

/* Títulos das subseções (sem negrito, mais leves) */
.page-noticia .subsection-title {
    font-size: 1.08rem;
    margin-bottom: .8rem;
    font-weight: 500;
    color: var(--napi-green-dark);
    letter-spacing: .2px;
}

/* Grid com 2 colunas lado a lado */
.news-extra-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
    margin-bottom: 2rem;
}

/* MOBILE: vira 1 coluna */
@media (max-width: 768px) {
    .news-extra-grid {
        grid-template-columns: 1fr;
    }
}

/* =======================
   LINKS IMPORTANTES
   ======================= */

.news-important-link-item {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .55rem .75rem;
    border-radius: 12px;
    background-color: rgba(122,150,81,0.10);
    border: 1px solid rgba(122,150,81,0.18);
    font-size: 0.90rem;
    transition: background-color .18s ease-out, transform .18s ease-out;
}

.news-important-link-item i {
    font-size: 1rem;
    color: var(--napi-green-dark);
}

.news-important-link-item:hover {
    background-color: rgba(122,150,81,0.18);
    transform: translateY(-2px);
    text-decoration: none;
}

/* =======================
   PESQUISADORES RELACIONADOS
   ======================= */

.news-pesq-item {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .55rem .75rem;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,0.07);
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    transition: background-color .18s ease-out, transform .18s ease-out, box-shadow .18s ease-out;
}

.news-pesq-item:hover {
    background-color: #faf7f1;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.news-pesq-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px rgba(122,150,81,0.35);
}

.news-pesq-name {
    font-size: 0.92rem;
    margin-bottom: 0;
    font-weight: 500;
    color: #444;
}

.news-pesq-role {
    font-size: 0.78rem;
    color: #666;
    margin-top: -2px;
}

/* =======================
   NOTÍCIAS RELACIONADAS 
   (já estava bom, mas deixei coerente)
   ======================= */

.news-related-card {
    background-color: #fff;
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.07);
    transition: transform .18s ease-out, box-shadow .18s ease-out;
}

.news-related-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.news-related-image {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 12px;
}

/* Modal da imagem da notícia */
#modalFotoNoticia .modal-dialog {
    max-width: 900px;
}

#modalFotoNoticia .modal-content img {
    border-radius: 14px;
    box-shadow: 0 8px 28px rgba(0,0,0,0.35);
}

.modal-backdrop.show {
    backdrop-filter: blur(3px);
}











/* =========================================================
   MODO ALTO CONTRASTE (body.napi-contrast)
   ========================================================= */

body.napi-contrast {
    background-color: #000000;
    color: #ffffff;
}

/* textos gerais */
body.napi-contrast p,
body.napi-contrast h1,
body.napi-contrast h2,
body.napi-contrast h3,
body.napi-contrast h4,
body.napi-contrast h5,
body.napi-contrast h6,
body.napi-contrast span,
body.napi-contrast li,
body.napi-contrast label {
    color: #ffffff;
}

/* navbar + links */
body.napi-contrast .navbar {
    background-color: #000000;
    box-shadow: 0 2px 0 rgba(255,255,255,0.12);
}

body.napi-contrast .navbar-brand,
body.napi-contrast .navbar-brand .brand-text {
    color: #ffffff;
}

body.napi-contrast .navbar-nav .nav-link {
    color: #ffffff;
    background-image: none;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.4);
}

body.napi-contrast .navbar-nav .nav-link:hover {
    background-color: #ffffff;
    color: #000000 !important;
}

/* cards principais (seções brancas) */
body.napi-contrast .card-section,
body.napi-contrast .news-hero-card,
body.napi-contrast .news-highlight-card,
body.napi-contrast .news-related-card,
body.napi-contrast .contact-map-card,
body.napi-contrast .contact-form-card,
body.napi-contrast .contact-info-card,
body.napi-contrast .symbol-block,
body.napi-contrast .research-accordion .accordion-item,
body.napi-contrast .home-news-secondary,
body.napi-contrast footer {
    background-color: #000000;
    color: #ffffff;
    box-shadow: none;
    border-color: rgba(255,255,255,0.35);
}

/* tabelas e linhas */
body.napi-contrast table,
body.napi-contrast .table,
body.napi-contrast .table th,
body.napi-contrast .table td {
    background-color: #000000;
    color: #ffffff;
    border-color: rgba(255,255,255,0.35);
}

body.napi-contrast .table-hover tbody tr:hover {
    background-color: #222222 !important;
}

/* links em geral */
body.napi-contrast a {
    color: #ffd95a;
    text-decoration: underline;
}

body.napi-contrast a:hover {
    color: #ffffff;
}

/* botões */
body.napi-contrast .btn,
body.napi-contrast .btn-sugerir,
body.napi-contrast .hero-btn-primary,
body.napi-contrast .hero-btn-secondary,
body.napi-contrast .profile-links .btn {
    background-color: #ffffff;
    color: #000000;
    border-color: #ffffff;
}

body.napi-contrast .btn:hover,
body.napi-contrast .btn-sugerir:hover,
body.napi-contrast .hero-btn-primary:hover,
body.napi-contrast .hero-btn-secondary:hover,
body.napi-contrast .profile-links .btn:hover {
    background-color: #000000;
    color: #ffffff;
    border-color: #ffffff;
}

/* chips / tags */
body.napi-contrast .tag,
body.napi-contrast .person-chip,
body.napi-contrast .news-tag,
body.napi-contrast .napi-chip,
body.napi-contrast .napi-chip-total {
    background-color: #ffffff;
    color: #000000;
}

/* ícones acompanham a cor do texto */
body.napi-contrast i,
body.napi-contrast svg {
    color: currentColor;
    fill: currentColor;
}

/* fundo geral das áreas claras tipo bg-napi-soft */
body.napi-contrast .bg-napi-soft {
    background-color: #111111;
    color: #ffffff;
}

/* foco bem visível */
body.napi-contrast :focus-visible {
    outline: 2px solid #ffd95a;
    outline-offset: 2px;
}

/* Força a navbar a entrar no modo contraste */
body.napi-contrast .navbar,
body.napi-contrast .navbar.bg-white,
body.napi-contrast .navbar.bg-light,
body.napi-contrast .navbar.bg-body,
body.napi-contrast .navbar.bg-body-tertiary {
    background-color: #000000 !important;
    border-bottom: 1px solid rgba(255,255,255,0.35);
}

/* Garante texto da navbar em branco */
body.napi-contrast .navbar-brand,
body.napi-contrast .navbar-brand .brand-text,
body.napi-contrast .navbar-nav .nav-link {
    color: #ffffff !important;
}

/* =====================================
   MODO CONTRASTE — ajustes extras
   ===================================== */

/* NAVBAR ESCURA */
body.napi-contrast .navbar {
    background-color: #000000 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.8);
}

body.napi-contrast .navbar-brand,
body.napi-contrast .navbar-nav .nav-link {
    color: #f5f5f5 !important;
}

body.napi-contrast .navbar-nav .nav-link {
    background-image: none; /* tira o degradê verde no hover */
}

body.napi-contrast .navbar-nav .nav-link:hover {
    background-color: #f5f5f5;
    color: #000000 !important;
}

/* =====================================
   SOBRE NÓS — HISTÓRIA / LINHA DO TEMPO
   ===================================== */

body.napi-contrast .about-history {
    background-color: #050505;
}

body.napi-contrast .about-history::after {
    background-color: #101010;  /* metade direita mais escura */
}

body.napi-contrast .history-text,
body.napi-contrast .history-timeline {
    color: #f5f5f5;
}

body.napi-contrast .history-text p,
body.napi-contrast .history-timeline p {
    color: #e8e8e8;
}

body.napi-contrast .timeline-list::before {
    background: rgba(255,255,255,0.45);
}

body.napi-contrast .timeline-marker {
    background: #000000;
    border-color: var(--napi-yellow);
    box-shadow: 0 0 0 2px #000000;
}

/* =====================================
   SOBRE NÓS — LINHAS DE PESQUISA
   ===================================== */

body.napi-contrast .research-accordion .accordion-item {
    background-color: #050505;
    box-shadow: 0 3px 12px rgba(0,0,0,0.7);
}

body.napi-contrast .research-accordion .accordion-button,
body.napi-contrast .research-accordion .accordion-body {
    background-color: #050505;
    color: #f5f5f5;
}

body.napi-contrast .research-accordion .accordion-button:not(.collapsed) {
    background-color: #0b0b0b;
}

body.napi-contrast .research-accordion .accordion-button::after {
    filter: invert(1); /* deixa a setinha clara no dark */
}

/* Chips e cards auxiliares na seção "Sobre nós" */
body.napi-contrast .napi-chip-total,
body.napi-contrast .napi-chip,
body.napi-contrast .symbol-block {
    background-color: #111111;
    color: #f5f5f5;
    border-color: rgba(255,255,255,0.12);
}

/* =====================================
   MODO CONTRASTE / DARK (NAPI)
   ===================================== */

/* Base geral */
body.napi-contrast {
    background-color: #000000;
    color: #ffffff;
}

/* Deixar navbar escura também */
body.napi-contrast .navbar {
    background-color: #000000 !important;
    border-bottom: 1px solid #333333;
}

body.napi-contrast .navbar-brand,
body.napi-contrast .navbar-brand .brand-text,
body.napi-contrast .navbar-nav .nav-link {
    color: #ffffff !important;
}

/* tira o “fill” verde no hover da navbar no modo contraste */
body.napi-contrast .navbar-nav .nav-link {
    background-image: none;
    border-radius: 999px;
    border: 1px solid transparent;
}

body.napi-contrast .navbar-nav .nav-link:hover,
body.napi-contrast .navbar-nav .nav-link:focus-visible {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Fundo preto para as áreas principais / cards */
body.napi-contrast main,
body.napi-contrast section,
body.napi-contrast .card,
body.napi-contrast .card-section,
body.napi-contrast .news-hero-card,
body.napi-contrast .news-highlight-card,
body.napi-contrast .news-list-item,
body.napi-contrast .news-article-card,
body.napi-contrast .news-related-card,
body.napi-contrast .about-history,
body.napi-contrast .history-text,
body.napi-contrast .history-timeline,
body.napi-contrast .research-accordion .accordion-item,
body.napi-contrast .research-accordion .accordion-button,
body.napi-contrast .research-accordion .accordion-body,
body.napi-contrast .news-important-link-item,
body.napi-contrast .news-pesq-item,
body.napi-contrast footer {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #555555 !important;
    box-shadow: none !important;
}

/* “Meia faixa” bege da história vira escuro */
body.napi-contrast .about-history::after {
    background-color: #050505 !important;
}

/* Marcadores da linha do tempo mais visíveis */
body.napi-contrast .timeline-marker {
    background-color: #000000 !important;
    border-color: #ffffff !important;
    box-shadow: 0 0 0 2px #000000;
}

/* Acordeon das linhas de pesquisa */
body.napi-contrast .research-accordion .accordion-button {
    background-color: #000000 !important;
    color: #ffffff !important;
}

body.napi-contrast .research-accordion .accordion-button:not(.collapsed) {
    background-color: #050505 !important;
}

body.napi-contrast .linha-icon {
    background: linear-gradient(135deg, #ffffff, #bbbbbb) !important;
    color: #000000 !important;
}

/* Chips / tags / pills em modo escuro */
body.napi-contrast .napi-chip,
body.napi-contrast .napi-chip-total,
body.napi-contrast .person-chip,
body.napi-contrast .symbol-block,
body.napi-contrast .home-pillar,
body.napi-contrast .news-important-link,
body.napi-contrast .news-important-link-item {
    background-color: #111111 !important;
    color: #ffffff !important;
    border-color: #555555 !important;
}

/* Links importantes & pesquisadores relacionados (notícia individual) */
body.napi-contrast .news-important-link-item i,
body.napi-contrast .news-pesq-role,
body.napi-contrast .news-meta {
    color: #dddddd !important;
}

/* Cards de pessoas (Quem somos) */
body.napi-contrast .person-card {
    background-color: #000000 !important;
    box-shadow: none !important;
}

body.napi-contrast .person-card:hover {
    background-color: #111111 !important;
    box-shadow: 0 0 0 1px #444444 !important;
}

/* Links em modo contraste: texto branco + sublinhado */
body.napi-contrast a {
    color: #ffffff !important;
    text-decoration: underline;
}

/* Hover “invertendo” as cores principais */
body.napi-contrast a:hover,
body.napi-contrast a:focus-visible,
body.napi-contrast button:hover,
body.napi-contrast button:focus-visible,
body.napi-contrast .btn:hover,
body.napi-contrast .btn:focus-visible,
body.napi-contrast .nav-link:hover,
body.napi-contrast .nav-link:focus-visible {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Ícones acompanham a cor do texto */
body.napi-contrast i,
body.napi-contrast svg {
    color: inherit !important;
    fill: currentColor !important;
}

/* Ícone desativado */
.action-icon.disabled {
    opacity: 0.35;
    cursor: not-allowed !important;
    border-radius: 6px;
    padding: 4px;
    transition: background-color 0.15s ease-in-out, opacity 0.15s;
}

/* Hover vermelho para ações desativadas */
.action-icon.disabled:hover {
    background-color: #f8d7da; /* vermelho bem suave */
    opacity: 0.6;
}

/* QUEM SOMOS MAIS UMAS */

/* Badges de categoria no card da equipe */
.person-role-badge {
    display: inline-block;
    margin-bottom: 0.25rem;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Coordenador: verde principal */
.person-role-badge-coord {
    background-color: rgba(122,150,81,0.16);
    color: #4e5b37;
}

/* Pesquisador: amarelo */
.person-role-badge-pesq {
    background-color: rgba(228,178,67,0.20);
    color: #7a5a1d;
}

/* Colaborador: neutro */
.person-role-badge-colab {
    background-color: rgba(0,0,0,0.06);
    color: #555;
}

/* Linkzinho "Ver perfil completo" dentro do card */
.person-more-link {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--napi-green-dark);
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    transition: color .18s ease-out, transform .18s ease-out;
}

.person-more-link i {
    font-size: 1rem;
}

.person-card:hover .person-more-link {
    color: var(--napi-green);
    transform: translateX(2px);
}

/* ============================
   AJUSTES QUEM SOMOS
   ============================ */

/* Card mais compacto e tudo centralizado */
.page-quem-somos .person-card {
    position: relative;
    padding: 3.2rem 1.3rem 1.3rem; /* mais espaço em cima pro avatar */
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;    /* centraliza tudo horizontalmente */
    text-align: center;
    background: #ffffff;
    border-radius: 1.2rem;
    border: 1px solid rgba(15,23,42,0.05);
    box-shadow: 0 6px 18px rgba(15,23,42,0.06);
    transition:
        box-shadow .22s ease-out,
        transform .22s ease-out,
        border-color .22s ease-out,
        background-color .22s ease-out;
}

.page-quem-somos .person-card:hover {
    box-shadow: 0 12px 30px rgba(15,23,42,0.12);
    transform: translateY(-4px);
    border-color: rgba(15,23,42,0.12);
}

/* Avatar "flutuando", mas sem ficar em cima do texto */
.page-quem-somos .person-avatar-wrapper {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%); /* metade pra cima do topo do card */
    width: 96px;
    height: 96px;
    border-radius: 50%;
    padding: 3px;
    border: 3px solid #d8e2c4;
    background: #f6f4ec;
    box-shadow: 0 6px 16px rgba(15,23,42,0.18);
}

.page-quem-somos .person-avatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

/* Nome e textos mais próximos, sem o avatar por cima */
.page-quem-somos .person-name {
    margin-top: 0.9rem;     /* aparece logo abaixo do avatar */
    margin-bottom: 0.4rem;
    font-size: 1.02rem;
    font-weight: 600;
}

.page-quem-somos .person-role {
    font-size: 0.86rem;
    line-height: 1.35;
}

/* Chips de área */
.page-quem-somos .person-chip {
    display: inline-block;
    margin: 0.1rem 0.2rem;
    padding: 0.12rem 0.35rem;
    border-radius: 999px;
    font-size: 0.75rem;
}

/* Badges de categoria (coordenador, pesquisador, colaborador) */
.page-quem-somos .person-role-badge {
    display: inline-block;
    margin-top: 0.35rem;
    margin-bottom: 0.15rem;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.page-quem-somos .person-role-badge-coord {
    background-color: rgba(122,150,81,0.16);
    color: #4e5b37;
}
.page-quem-somos .person-role-badge-pesq {
    background-color: rgba(228,178,67,0.20);
    color: #7a5a1d;
}
.page-quem-somos .person-role-badge-colab {
    background-color: rgba(0,0,0,0.06);
    color: #555;
}

/* Animação de entrada / transição nos filtros */
.page-quem-somos .team-member-card {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .28s ease-out, transform .28s ease-out;
}
.page-quem-somos .team-member-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Botão "Ver perfil completo" menor, em pílula e centralizado */
.page-quem-somos .person-more-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    font-size: 0.8rem;
    font-weight: 500;
    border-radius: 999px;
    border: 1px solid var(--napi-green, #7a9651);
    padding: 0.18rem 0.9rem;
    color: var(--napi-green-dark, #4e5b37);
    background-color: transparent;
    transition:
        background-color .2s ease-out,
        color .2s ease-out,
        border-color .2s ease-out,
        transform .16s ease-out;
    margin-top: 0.6rem;
}

.page-quem-somos .person-more-link i {
    font-size: 1rem;
}

/* Quando o card é hover, a pílula enche de cor */
.page-quem-somos .person-card:hover .person-more-link {
    background-color: var(--napi-green, #7a9651);
    color: #ffffff;
    border-color: var(--napi-green, #7a9651);
    transform: translateX(2px);
}

/* Filtros com transição suave (mantém o que já tínhamos, só escopado) */
.page-quem-somos .team-filter-nav .nav-link {
    font-size: 0.9rem;
    padding: 0.3rem 0.9rem;
    border-radius: 999px;
    margin: 0 0.15rem;
    color: #555;
    transition:
        background-color .18s ease-out,
        color .18s ease-out;
}
.page-quem-somos .team-filter-nav .nav-link:hover {
    background-color: rgba(122,150,81,0.09);
    color: #374151;
}
.page-quem-somos .team-filter-nav .nav-link.active {
    background-color: var(--napi-green, #7a9651);
    color: #ffffff;
}


/* ============================
   AJUSTES FINOS - QUEM SOMOS
   ============================ */

/* 1) Cards só com a altura do conteúdo */
.page-quem-somos .person-card {
    height: auto;          /* garante que não force 100% da coluna */
    min-height: 0;         /* só por segurança, em alguns navegadores */
}

/* 2) Avatar maior (aprox. tamanho original) */
.page-quem-somos .person-avatar-wrapper {
    width: 120px;          /* aumenta o diâmetro */
    height: 120px;
    /* resto permanece igual (posição, borda etc.) */
}

/* 3) Espaço extra acima de cada card da grid
   pra dar “respiro” pro avatar e não ficar em cima
   da linha de baixo quando há mais de uma fileira */
.page-quem-somos .team-member-card {
    margin-top: 3.2rem;    /* cria um colchão vertical entre as linhas */
}

/* Em telas bem pequenas podemos reduzir um pouco esse espaço
   pra não ficar um vão exagerado */
@media (max-width: 576px) {
    .page-quem-somos .team-member-card {
        margin-top: 2.4rem;
    }
}

/* Grade dos cards de pessoas */
.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 2rem 2.5rem; /* menos espaço entre linhas/colunas */
    margin-top: 2rem;
}

.person-card {
    position: relative;
    background: #fdfdfb;
    border-radius: 26px;
    padding: 5rem 2.2rem 2rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
    display: flex;
    flex-direction: column;
    height: 100%; /* faz o card ocupar toda a altura da célula da grid */
    transition:
        transform 0.22s ease-out,
        box-shadow 0.22s ease-out,
        background 0.22s ease-out;
}

/* Parte de baixo do card: chips + botão */
.person-footer {
    margin-top: auto;          /* empurra o footer pra base do card */
    padding-top: 1.25rem;
}

/* Animação no hover do card */
.person-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(15, 23, 42, 0.12);
    background: #ffffff;
}

.person-avatar-wrapper {
    position: absolute;
    top: -76px;          /* desce/sobe aqui se quiser ajustar ainda mais */
    left: 50%;
    transform: translateX(-50%);
    width: 148px;        /* avatar um pouco maior */
    height: 148px;
    border-radius: 50%;
    padding: 4px;
    background: linear-gradient(135deg, #8aa54f, #c4d980);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25);
}

.person-avatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

/* Pill da categoria logo abaixo do avatar */
.person-category-pill {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 86px;               /* “abaixa” a pill em relação ao avatar */
    padding: 0.25rem 0.85rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.55);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6b7280;
    font-weight: 600;
}

/* home mais algumas coisas */

/* link que envolve o card todo */
.home-pillar-linkcard {
    display: block;
    text-decoration: none;
    color: inherit;
}

/* card base */
.home-pillar {
    border-radius: 1.2rem;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04);
    transition:
        transform 0.18s ease-out,
        box-shadow 0.18s ease-out,
        background-color 0.18s ease-out;
    cursor: pointer;
    height: 100%;
}

/* hover no card inteiro */
.home-pillar-linkcard:hover .home-pillar {
    transform: translateY(-3px);
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.07);
    background-color: #f6f7f1; /* levemente mais claro/verdeado */
}

/* ícone redondinho */
.pillar-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.65rem;
    background: #d7dd9b;                /* tom oliva claro, combina com o logo */
    color: #556020;
    transition:
        background-color 0.18s ease-out,
        color 0.18s ease-out,
        transform 0.18s ease-out;
    font-size: 1.25rem;
}

/* ícone reage junto com o hover do card */
.home-pillar-linkcard:hover .pillar-icon {
    background-color: #8ca63a;          /* mais saturado no hover */
    color: #ffffff;
    transform: translateY(-1px) scale(1.03);
}

/* linha de link com a bolhinha */
.pillar-link-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.35rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #5f6b3d;
}

/* texto do "link" */
.pillar-link-text {
    display: inline-flex;
    align-items: center;
    gap: 0.1rem;
}

/* a bolhinha do lado direito */
.pillar-link-dot {
    width: 11px;
    height: 11px;
    border-radius: 999px;
    border: 2px solid #8ca63a;
    background: transparent;
    flex-shrink: 0;
    transition:
        background-color 0.18s ease-out,
        border-color 0.18s ease-out,
        transform 0.18s ease-out;
}

/* quando passar o mouse no card, a bolhinha enche e cresce um tiquinho */
.home-pillar-linkcard:hover .pillar-link-dot {
    background-color: #8ca63a;
    border-color: #8ca63a;
    transform: scale(1.1);
}

/* acessibilidade: foco via teclado */
.home-pillar-linkcard:focus-visible .home-pillar {
    outline: 2px solid #8ca63a;
    outline-offset: 4px;
}

/* força todos os cards dessa seção a terem a mesma altura */
.home-pillar {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* força o texto a ajustar sem distorcer */
.home-pillar p {
    flex-grow: 1;
}

/* Torna toda a área clicável */
.pillar-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

/* Altura igual para todos */
.home-pillar {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Ícone no topo */
.pillar-icon {
    width: 48px;
    height: 48px;
    background: #AABA32;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.3rem;
    margin-bottom: 0.8rem;
}

/* Link + bolhinha */
.pillar-link-row {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0.8rem;
}

.pillar-link-text {
    font-weight: 600;
    color: #65734A;
    transition: color .2s;
}

.pillar-link-dot {
    width: 7px;
    height: 7px;
    background: #65734A;
    border-radius: 50%;
    transition: transform .2s, background .2s;
}

/* Hover no card */
.pillar-card-link:hover .home-pillar {
    background: #f4f7eb !important;
    transition: background .2s;
}

.pillar-card-link:hover .pillar-link-text {
    color: #3e4b28;
}

.pillar-card-link:hover .pillar-link-dot {
    background: #3e4b28;
    transform: scale(1.3);
}

/* CARD INTEIRO CLICÁVEL */
.clickable-news-card {
    cursor: pointer;
    transition: transform .22s ease-out, box-shadow .22s ease-out, background-color .22s ease-out;
}

.clickable-news-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.12);
    background-color: #ffffff;
}

/* pequenos ajustes nas imagens */
.clickable-news-card:hover .home-news-image,
.clickable-news-card:hover .home-news-thumb {
    transform: scale(1.06);
}

/* Avatares animados */
.animated-avatar img {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #ffffffaa;
    box-shadow: 0 0 0 rgba(0,0,0,0);
    transition: transform .25s ease, box-shadow .25s ease;
}

.animated-avatar:hover img {
    transform: translateY(-4px) scale(1.06);
    box-shadow: 0 6px 16px rgba(0,0,0,0.28),
                0 0 12px var(--napi-primary);
}

/* Botão pílula */
.pill-btn {
    border-radius: 50px;
    padding: .45rem 1rem;
    transition: background .25s ease, color .25s ease;
}

.pill-btn:hover {
    background: var(--napi-primary);
    color: #fff;
}

/* Mantém a linha com boa distribuição */
.home-avatar-row {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
}

.home-avatar-more {
    font-size: .85rem;
    color: #555;
}

/* Faz as duas metades terem a mesma altura */
.home-highlight-section .row {
    align-items: stretch;
}

/* --- Equipe em Foco: alinhamento perfeito --- */

.home-highlight-left {
    display: block !important;  
}

.home-highlight-left h3 {
    margin-bottom: .5rem;
}

.home-highlight-left p {
    margin-bottom: 1.2rem !important;
}

/* Linha de avatares */
.home-avatar-row {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: nowrap;
    margin-bottom: 1rem !important;
}

/* Avatar circular */
.home-avatar-link img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #d2d8c7;
    transition: transform .25s ease, box-shadow .25s ease;
}

.home-avatar-link img:hover {
    transform: scale(1.07);
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
}

/* Texto +equipe */
.home-avatar-more {
    font-size: .9rem;
    opacity: .6;
    margin-left: 4px;
}

/* Botão centralizado */
.home-highlight-left .btn {
    display: inline-block;
    margin-top: .3rem;
}

/* ==== Avatares grandes com flutuação suave ==== */

.home-avatar-network {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.5rem 0;
}

.home-avatar-bubble {
    display: inline-block;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #c7d1a3;
    background: #f7f7f2;
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    animation: bubbleFloat 4s ease-in-out infinite;
}

.home-avatar-bubble img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Animação leve (sensação de rede em movimento) */
@keyframes bubbleFloat {
    0%   { transform: translateY(0px); }
    50%  { transform: translateY(-6px); }
    100% { transform: translateY(0px); }
}

/* Efeito hover */
.home-avatar-bubble:hover {
    transform: scale(1.12);
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
}

/* + equipe completa */
.home-avatar-more {
    font-size: 0.85rem;
    color: #6b7750;
    opacity: 0.9;
    padding-left: 6px;
}

/* EQUIPE EM FOCO – DOCK DE AVATARES */
.home-avatar-dock-row {
    display: flex;
    align-items: flex-end;
    gap: 0.8rem;
    padding: 0.4rem 0 1rem;
    flex-wrap: nowrap;
}

.home-avatar-dock {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    text-decoration: none;
    cursor: pointer;
    /* “dock” base */
    width: 68px;
    height: 78px;
    transform-origin: center bottom;
    transition:
        transform 0.18s ease-out,
        box-shadow 0.18s ease-out,
        filter 0.18s ease-out;
}

.home-avatar-dock-img-wrapper {
    width: 64px;
    height: 64px;
    border-radius: 999px;
    border: 3px solid var(--napi-olive-300, #cbd49a);
    background: #f7f8f2;
    overflow: hidden;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
    transition:
        border-color 0.18s ease-out,
        box-shadow 0.18s ease-out;
}

.home-avatar-dock img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    display: block;
}

/* selinho “Coord.” / “Pesq.” */
.home-avatar-dock-badge {
    position: absolute;
    bottom: -0.2rem;
    padding: 0.08rem 0.45rem;
    border-radius: 999px;
    font-size: 0.65rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.9);
    color: var(--napi-green-700, #355b2e);
    border: 1px solid rgba(148, 163, 184, 0.5);
    backdrop-filter: blur(4px);
}

/* efeito “dock do Mac” – aumenta e sobe levemente */
.home-avatar-dock:hover {
    transform: translateY(-6px) scale(1.18);
    z-index: 2;
}

.home-avatar-dock:hover .home-avatar-dock-img-wrapper {
    border-color: var(--napi-green-700, #355b2e);
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.22);
}

.home-avatar-more {
    margin-left: 0.75rem;
    font-size: 0.8rem;
    color: var(--napi-green-700, #355b2e);
    font-weight: 500;
    white-space: nowrap;
}

/* botão “Conhecer equipe” coladinho na base do card */
.home-team-btn {
    margin-top: 0.5rem;
}

/* ===== Equipe em foco (home) ===== */

.home-team-card {
    height: 100%;
}

.home-team-text {
    margin-bottom: 0.75rem;
}

.home-avatar-dock-row {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.9rem;
    padding: 0.75rem 0 0.5rem;
}

.home-avatar-dock {
    position: relative;
    width: 70px;
    height: 70px;
    border-radius: 999px;
    background: #fdfdf9;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition:
        transform 0.18s ease-out,
        box-shadow 0.18s ease-out,
        filter 0.18s ease-out;
    overflow: hidden;
}

.home-avatar-dock-img-wrapper {
    width: 100%;
    height: 100%;
    border-radius: 999px;
    overflow: hidden;
}

.home-avatar-dock-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Efeito “dock” tipo macOS */
.home-avatar-dock-row:hover .home-avatar-dock {
    transform: scale(0.95);
    filter: grayscale(20%);
}

.home-avatar-dock-row:hover .home-avatar-dock:hover {
    transform: translateY(-6px) scale(1.22);
    filter: none;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.18);
    z-index: 2;
}

.home-avatar-dock-plus {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px dashed #c0cf7b;
    color: #7a8638;
    font-weight: 600;
    font-size: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.25rem;
}

/* Botão sempre “colado” à base da coluna */
.home-team-btn-wrapper {
    margin-top: auto;
}

@media (max-width: 991.98px) {
    .home-avatar-dock-row {
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.7rem;
    }
}

/* PUBLICAÇÕES RECENTES – HOME */

.home-pub-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.home-pub-card {
    padding: 0.8rem 1rem;
    border-radius: 14px;
    background: #fafafa;
    border: 1px solid #e6e6e6;
    transition: all 0.25s ease;
}

.home-pub-card:hover {
    background: #f1f8ee;
    border-color: #9ec48f;
    transform: translateY(-2px);
}

.home-pub-title {
    font-weight: 600;
    font-size: 0.95rem;
    color: #333;
    line-height: 1.3;
}

.home-pub-meta {
    font-size: 0.78rem;
    color: #5d6c5e;
}

.home-pub-authors {
    display: flex;
    align-items: center;
    gap: 6px;
}

.home-pub-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #ffffff;
    box-shadow: 0 0 0 2px #d0dcbc;
}

.home-pub-more {
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 10px;
    background: #dfe8d7;
    color: #44533e;
}

/* Home – publicações recentes (layout novo) */

.home-pub-item {
    padding: 6px 8px;
    border-radius: 12px;
    transition: background-color .18s ease-out, transform .18s ease-out;
}

.home-pub-item:hover {
    background-color: #faf7f1;
    transform: translateY(-2px);
}

.home-pub-card {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.home-pub-pill {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    background-color: rgba(122,150,81,0.14);
    color: var(--napi-green-dark);
    font-size: 0.78rem;
    white-space: nowrap;
}

.home-pub-pill-light {
    background-color: rgba(228,178,67,0.18);
    color: #7b5a1a;
}

.home-pub-meta-row {
    min-height: 36px;
}

.home-pub-meta-label {
    font-size: 0.78rem;
    color: #777;
}

.home-pub-link-icon {
    font-size: 0.95rem;
    vertical-align: -1px;
}

.home-pub-link-disabled {
    cursor: default;
    color: #444;
}

.home-pub-link-hint {
    font-size: 0.78rem;
    color: #888;
}

.home-pub-no-link {
    font-size: 0.78rem;
    color: #999;
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
}

/* -------- PUBLICAÇÕES RECENTES — AVATARES -------- */

.home-pub-authors {
    display: flex;
    align-items: center;
    gap: 6px;
}

.home-pub-author-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid #c9d3a8; /* tom girassol suave */
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.home-pub-author-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* garante avatar redondinho perfeito */
    display: block;
}

/* Efeito ao passar o mouse */
.home-pub-author-avatar:hover {
    transform: scale(1.12);
    box-shadow: 0 4px 6px rgba(0,0,0,0.12);
}

/* +N */
.home-pub-more-badge {
    font-size: 0.75rem;
    background: #e5ecda;
    color: #5e6b3e;
    padding: 4px 8px;
    border-radius: 12px;
    font-weight: 600;
}

.home-avatar-link.home-avatar-sm img {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}









.footer-social-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e9ecef;
    color: #444;
    font-size: 1.1rem;
    transition: all .2s ease;
    text-decoration: none;
}

.footer-social-btn:hover {
    background: var(--napi-green);
    color: #fff;
    transform: translateY(-3px);
}



/* =========================================
   QUEM SOMOS — altura igual apenas por linha
========================================= */

/* mantém comportamento padrão do Bootstrap */
.page-quem-somos #grid-equipe .row > [class*="col-"]{
  display: flex;
}

/* link ocupa a coluna inteira */
.page-quem-somos .person-card-link{
  display: flex;
  width: 100%;
}

/* card NÃO força altura total */
.page-quem-somos .person-card{
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* botão sempre no rodapé do card */
.page-quem-somos .person-more-link{
  margin-top: auto;
}