/* ── TEMPLATE 1: Artigo + Sidebar ── */

        /* Sidebar */
        #sidebar { padding-left: 2em; }
        #sidebar hr { top: 2em; margin-bottom: 4em; }
        #sidebar section { margin-bottom: 2em; }
        #sidebar .row.half { gap: 0.5em; margin-bottom: 1em; }
        #sidebar .row.half .image { margin: 0; }
        #sidebar .row.half h4 { font-size: 0.9em; margin-bottom: 0.2em; }
        #sidebar .row.half p  { font-size: 0.8em; line-height: 1.4; }

        /* Artigo principal */
        #content article > section { margin-bottom: 3em; }
        #content .image.featured { margin-bottom: 1.5em; }
        #content .image.featured img { border-radius: 4px; }

        /* Linha separadora entre artigos relacionados no rodapé */
        .related-articles { margin-top: 2em; }

        /* Responsivo, sidebar vai para baixo no mobile */
        @media (max-width: 760px) {
            #sidebar { padding-left: 0; border-top: solid 1px rgba(128,128,128,0.2); padding-top: 2em; }
        }

/* variável global */
:root {
    --z-overlay: 100;
}

#lightbox-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: var(--z-overlay);
}

#lightbox-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

#lightbox-img {
    max-width: 90vw;
    max-height: 90vh;
    transform: scale(0.94);
    transition: transform 0.4s ease, opacity 0.3s ease;
}

#lightbox-overlay.active #lightbox-img {
    transform: scale(1);
}

.zoomable {
    cursor: zoom-in;
    position: relative;
    z-index: 1;
}




        .apoios {
            display: flex;
            flex-direction: column;
            gap: 2.5em;
        }

        /* --- ITEM --- */
        .tag-person {
            display: flex;
            align-items: flex-start;
            gap: 1.5em;
            border-bottom: 2px solid rgba(0, 0, 0, 0.08);
            padding-bottom: 1.8em;
        }

        /* --- IMAGEM À ESQUERDA --- */
        .pc-img img {
            width: 150px;
            height: 150px;
            object-fit: contain;

        }

        /* --- BLOCO DIREITO --- */
        .pc-info {
            flex: 1;
            max-width: 500px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }

        /* --- TEXTO --- */
        .pc-desc h4 {
            margin: 0 0 0.3em;
            font-weight: 600;
            letter-spacing: 0.2px;
        }

        .pc-desc p {
            margin: 0;
            max-width: 95%;
            font-size: 0.9em;
            line-height: 1.6em;
            color: #555;
        }

        /* --- REDES --- */
        .pc-redes {
            display: flex;
            gap: 6px;
            margin-top: 4px;
            align-items: center;
        }

        .pc-redes .fa {
            width: 28px !important;
            height: 28px !important;
            line-height: 28px !important;
            font-size: 12px !important;

            display: inline-block;
            text-align: center;

            box-shadow: none !important;
            border: none !important;
            background: none;
            color: #000000;

        }

        .pc-redes .fa:hover {
            transform: scale(1.08);
            color: #000000;
        }

        .pc-redes .fa-instagram:hover {
            background: #ffffff;
        }

        .pc-redes .fa-facebook:hover {
            background: #ffffff;
        }

        .pc-redes .fa-linkedin:hover {
            background: #0077b5;
        }

        /* --- ICONES --- */
        .pc-redes .social {
            width: 34px;
            height: 34px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: #f2f2f2;
            color: #333;
            font-size: 14px;
            text-decoration: none;
            transition: all 0.25s ease;
        }

        .pc-redes .social:hover {
            transform: scale(1.1);
            color: #fff;
        }

        /* CORES */
        .pc-redes .ig:hover {
            background: radial-gradient(circle at 30% 107%,
                    #fdf497 0%, #fd5949 45%, #e6c683 60%, #285AEB 90%);
        }

        .pc-redes .fb:hover {
            background: #1877f2;
        }

        .pc-redes .in:hover {
            background: #0077b5;
        }

        /* --- BLOCO DE PROJETOS (lado direito) --- */
        .pc-projetos {
            display: grid;
            margin-top: 2px;
            flex-shrink: 0;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
            min-width: 160px;
            max-width: 260px;
            width: 100%;
        }

        /* LINK ocupa todo espaço */
        .pc-projetos a {
            position: relative;
            width: 100%;
            aspect-ratio: 1 / 1;
            overflow: hidden;
        }

        .pc-projetos a::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(0, 0, 0, 0.15);
            opacity: 0;
            transition: 0.3s;
        }

        .pc-projetos a:hover::after {
            opacity: 1;
        }

        /* IMAGEM ocupa tudo */
        .pc-projetos img {
            position: absolute;
            top: 0;
            left: 0;

            width: 100%;
            height: 100%;

            object-fit: cover;
            display: block;
            image-rendering: auto;
            transition: transform 0.3s ease;
        }

        .pc-projetos a:hover img {
            transform: scale(1.05);
        }

        #lightbox-overlay {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.85);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9999;

            opacity: 0;
            visibility: hidden;
            transition: 0.3s ease;
        }

        #lightbox-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        #lightbox-overlay img {
            max-width: 90%;
            max-height: 90%;
            object-fit: contain;
            border-radius: 6px;
        }

        .lightbox-content {
            text-align: center;
        }

        #lightbox-title {
            margin-top: 10px;
            color: #fff;
            font-size: 14px;
        }

        .pc-projetos a::before {
            content: attr(data-title);
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;

            background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
            color: #fff;
            font-size: 12px;
            padding: 8px;

            opacity: 0;
            transition: 0.3s;
        }

        .pc-projetos a:hover::before {
            opacity: 1;
        }

        /* --- RESPONSIVO --- */
        @media (max-width: 768px) {
            .tag-person {
                flex-direction: column;
                align-items: center;
                text-align: center;
            }

            .pc-info {
                align-items: center;
            }

            .pc-projetos {
                margin-top: 1em;
                /* 1fr = espaço disponível */
                /* aspect-ratio = mantém quadrado */
            }


        }