/* ==========================================================================
   1. ARTIGO ABERTO (QUANDO CLICAS PARA LER A NOTÍCIA TODA)
   ========================================================================== */
.view-article .article-full-image, 
.view-article .item-image,
.view-article .article-feature-gallery {
    width: 100% !important;
    height: 450px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #f8f9fa !important;
    margin-bottom: 25px !important;
    overflow: hidden !important;
    border-bottom: 1px solid #eee !important;
    padding-bottom: 20px !important;
}

.view-article .article-full-image img, 
.view-article .item-image img,
.view-article .article-feature-gallery img {
    height: 100% !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
}




/* 2. Tornar a DATA maior e bem visível */
.article-info dd.published, 
.article-info dd, 
.article-info span {
    font-size: 1.1rem !important; 
    font-weight: bold !important;
    color: #1a1a1a !important;
    display: block !important;
    line-height: 1.2 !important;
}




/* ==========================================================================
   2. BARRA DE PESQUISA (A LUPA À DIREITA)
   ========================================================================== */
.barra-escola-lupa {
    display: flex !important;
    justify-content: flex-end !important;
    width: 100% !important;
}

.barra-escola-lupa .js-finder-search-form {
    display: flex !important;
    width: 280px !important;
}

.barra-escola-lupa input.finder-searchquery {
    flex: 1 !important;
    height: 38px !important;
    border: 1px solid #162867 !important;
    border-radius: 4px 0 0 4px !important;
}

.barra-escola-lupa button.btn-primary {
    width: 50px !important;
    min-width: 50px !important;
    height: 38px !important;
    background-color: #162867 !important;
    border: 1px solid #162867 !important;
    border-radius: 0 4px 4px 0 !important;
    font-size: 0 !important;
    position: relative !important;
}

.barra-escola-lupa button.btn-primary::before {
    content: "\f002" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    color: #fff !important;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    visibility: visible !important;
}

/* ==========================================================================
   3. PÁGINA INICIAL (ADDON ARTICLES - 3 COLUNAS)
   ========================================================================== */
.sppb-addon-article, .sppb-article-item {
    transition: all 0.3s ease !important;
    background: #fff !important;
    border-radius: 8px !important;
}

.sppb-addon-article:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 10px rgba(0,0,0,0.15) !important;
}

/* Altura fixa para as 3 colunas não desalinharem */
.sppb-addon-article-image-wrap {
    height: 200px !important;
    overflow: hidden !important;
}

.sppb-addon-article-image-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.5s ease !important;
}


/* AJUSTE Titulos (MENOS ESPAÇO) */
.home-articles-list .sppb-article-info-wrap {
    padding-left: 10px !important;   /* Ajusta aqui: menos é mais "junto", mais é mais "afastado" */
    padding-right: 10px !important;
    padding-bottom: 10px !important;
    padding-top: 10px !important;
    display: block !important;
}

/* Título H5 */
.home-articles-list .sppb-article-info-wrap h5 {
    margin-left: 0 !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}


/* ==========================================================================
   4. PÁGINA DE NOTÍCIAS (BLOG - 2 COLUNAS) - CÓPIA FIEL DA HOME
   ========================================================================== */

/* 0. RESTAURAR CORES */
.blog .article-intro-image img, 
.blog .item-image img, 
.blog .article-list img {
    filter: grayscale(0) !important;
    -webkit-filter: grayscale(0) !important;
    opacity: 1 !important;
}

/* 1. IMAGENS: 4:3 para fotos 800x600 (Sem cortes) */
.blog .article-list .row > div:not(.col-md-12) .article-intro-image,
.blog .article-list .row > div:not(.col-md-12) .item-image {
    height: auto !important;
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    overflow: hidden !important;
    display: block !important;
    margin: 0 !important; /* Remove margens que o Joomla possa injetar */
}

.blog .article-list .row > div:not(.col-md-12) .article-intro-image img,
.blog .article-list .row > div:not(.col-md-12) .item-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* 2. O CARTÃO (ESTRUTURA IGUAL À HOME) */
.blog .article-list .row > div:not(.col-md-12) {
    padding: 15px !important; /* Espaço entre notícias */
}

/* Aplicamos o estilo EXATO da Secção 3 ao "article" ou "article-wrapper" */
.blog .article-list .row > div:not(.col-md-12) article,
.blog .article-list .row > div:not(.col-md-12) .article-wrapper,
.blog .article-list .row > div:not(.col-md-12) .item-content {
    background: #ffffff !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important; /* Igual à tua linha 75 */
    overflow: hidden !important;
    display: block !important;
    height: 100% !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05) !important; /* Sombra base leve */
}

/* 3. O EFEITO DE LEVANTAR (HOVER) - IGUAL À TUA LINHA 80 */
.blog .article-list .row > div:not(.col-md-12):hover article,
.blog .article-list .row > div:not(.col-md-12):hover .article-wrapper,
.blog .article-list .row > div:not(.col-md-12):hover .item-content {
    transform: translateY(-8px) !important;
    box-shadow: 0 15px 30px rgba(0,0,0,0.15) !important;
}

/* 4. TEXTO: Padding igual ao que ajustaste na Home (Linha 90) */
.blog .article-list .row > div:not(.col-md-12) .article-info-wrap,
.blog .article-list .row > div:not(.col-md-12) .item-content,
.blog .article-list .row > div:not(.col-md-12) .article-info {
    padding: 15px !important;
}

.blog .article-list .row > div:not(.col-md-12) h2,
.blog .article-list .row > div:not(.col-md-12) h3 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

/* ==========================================================================
1. Esconder o texto que o Joomla mostra indevidamente no blog 
========================================================================== */
.view-category .article-introtext, 
.view-category .article-content p,
.view-category section[itemprop="articleBody"] p {
    display: none !important;
}