/* news-archive.css */
:root { 
    --primary: #ff3b8d; 
    --bg: #0b0b12; 
    --card: #11111a; 
    --border: rgba(255,255,255,0.08); 
}

body {
    background: var(--bg);
    color: #e1e1e6;
    font-family: 'Inter', sans-serif;
    margin: 0;
    padding-top: 0;
}

.top-bar {
    top: 0 !important; /* Força o header a colar no topo absoluto */
}

.news-archive-container {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

.archive-header { margin-bottom: 40px; }
.archive-header h1 { font-family: 'Oswald'; font-size: 3rem; text-transform: uppercase; }
.archive-header h1 span { color: var(--primary); }

/* Filtros */
.category-pills { display: flex; gap: 10px; margin-top: 20px; }
.pill { 
    background: var(--card); border: 1px solid var(--border); color: #888; 
    padding: 8px 20px; border-radius: 20px; cursor: pointer; transition: 0.3s;
    font-weight: 600; font-size: 13px;
}
.pill:hover { border-color: var(--primary); color: #fff; }
.pill.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* Grid Principal */
.archive-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
}

/* BIG CARD (Destaque) */
.big-news-card {
    grid-column: 1 / -1;
    position: relative;
    height: 480px;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 40px;
    cursor: pointer;
    border: 1px solid var(--border);
}
.big-news-card img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s; }
.big-news-card:hover img { transform: scale(1.03); }
.big-content {
    position: absolute; inset: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.9));
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 40px;
}
.big-content h2 { font-family: 'Oswald'; font-size: 2.5rem; margin: 10px 0; }

/* HORIZONTAL CARDS */
.news-horizontal-card {
    display: flex; gap: 20px; background: var(--card);
    border-radius: 15px; border: 1px solid var(--border);
    margin-bottom: 25px; cursor: pointer; transition: 0.3s;
    height: 180px; overflow: hidden;
}
.news-horizontal-card:hover { transform: translateX(10px); border-color: var(--primary); }
.horizontal-img-box { width: 280px; flex-shrink: 0; }
.horizontal-img-box img { width: 100%; height: 100%; object-fit: cover; }
.news-card-content { padding: 20px; display: flex; flex-direction: column; justify-content: center; }
.tag { color: var(--primary); font-weight: 700; font-size: 11px; text-transform: uppercase; }

/* SIDEBAR */
.sidebar-box { background: var(--card); border: 1px solid var(--border); padding: 25px; border-radius: 20px; margin-bottom: 30px; }
.sidebar-box h3 { font-family: 'Oswald'; margin-top: 0; color: var(--primary); text-transform: uppercase; }

.news-sidebar {
    height: fit-content;
}

.sticky {
    position: sticky;
    top: 100px; /* Distância do topo quando o usuário scrolla */
}


.trending-item { display: flex; gap: 15px; margin-bottom: 20px; cursor: pointer; }
.trend-number { font-family: 'Oswald'; font-size: 24px; color: rgba(255,255,255,0.1); }
.trend-info h4 { margin: 0; font-size: 14px; line-height: 1.4; transition: 0.3s; }
.trending-item:hover h4 { color: var(--primary); }

@media (max-width: 900px) {
    .archive-grid { grid-template-columns: 1fr; }
    .news-horizontal-card { flex-direction: column; height: auto; }
    .horizontal-img-box { width: 100%; height: 200px; }
}

/* news-archive.css */
.news-horizontal-card {
    display: flex; 
    gap: 20px; 
    background: var(--card);
    border-radius: 15px; 
    border: 1px solid var(--border);
    margin-bottom: 25px; 
    cursor: pointer; 
    transition: 0.3s;
    
    /* MUDANÇA AQUI: Remova height fixo e use min-height */
    min-height: 180px; 
    height: auto; 
    overflow: visible; /* Permite que o conteúdo respire */
}

.news-horizontal-card, .sidebar-box, .submit-card {
    background: #12121c; /* Levemente mais claro que o body */
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

.news-card-content {
    padding: 20px; 
    display: flex; 
    flex-direction: column; 
    justify-content: center;
    flex: 1; /* Faz o texto ocupar o espaço restante */
}

.news-card-content h3 {
    margin: 10px 0;
    font-size: 1.4rem;
    line-height: 1.3; /* Melhora a leitura de títulos longos */
}

/* news-archive.css */
.horizontal-img-box {
    width: 280px; 
    min-height: 180px; /* Alinhado com o min-height do card */
    flex-shrink: 0;
}

.horizontal-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Garante que a imagem preencha o espaço sem deformar */
    display: block;
}

/* news-archive.css */

/* Grid das redes sociais na sidebar */
.social-links {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(45px, 1fr));
    gap: 12px;
    margin-top: 20px;
}

/* Estilo base dos botões */
.social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--border);
    border-radius: 12px;
    color: #fff;
    font-size: 20px;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Efeito de subir e brilhar no hover */
.social-btn:hover {
    transform: translateY(-5px);
    color: #fff;
}

/* Cores vibrantes específicas no hover */
.social-btn.twitch:hover { background: #9146FF; border-color: #9146FF; box-shadow: 0 5px 15px rgba(145, 70, 255, 0.4); }
.social-btn.twitter:hover { background: #000; border-color: #fff; }
.social-btn.youtube:hover { background: #FF0000; border-color: #FF0000; box-shadow: 0 5px 15px rgba(255, 0, 0, 0.4); }
.social-btn.instagram:hover { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); border-color: transparent; }
.social-btn.discord:hover { background: #5865F2; border-color: #5865F2; box-shadow: 0 5px 15px rgba(88, 101, 242, 0.4); }


@media (max-width: 900px) {
    .news-archive-container {
        margin: 20px auto;
        padding: 0 15px;
    }

    /* Transforma o grid em uma única coluna */
    .archive-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .archive-header h1 {
        font-size: 2.2rem;
        text-align: center;
    }

    /* Filtros: Permite scroll horizontal se houver muitas categorias */
    .category-pills {
        overflow-x: auto;
        padding-bottom: 10px;
        -webkit-overflow-scrolling: touch;
    }
    /* Card de Destaque */
    .big-news-card {
        height: 350px;
        border-radius: 12px;
    }

    .big-content h2 {
        font-size: 1.8rem;
    }

    /* Cards Horizontais: Transformar em Vertical no Mobile */
    .news-horizontal-card {
        flex-direction: column;
        height: auto;
        min-height: unset;
    }

    .horizontal-img-box {
        width: 100%;
        height: 200px;
    }

    .news-card-content h3 {
        font-size: 1.2rem;
        margin: 5px 0;
    }

    /* Remove o efeito de hover que desloca o card para não bugar o scroll lateral */
    .news-horizontal-card:hover {
        transform: none;
    }
    .news-sidebar {
        order: 2; /* Garante que a sidebar venha depois do feed */
    }

    .sidebar-box.sticky {
        position: static; /* Remove o sticky no mobile */
    }

    .social-links {
        grid-template-columns: repeat(5, 1fr); /* 5 botões em uma linha */
        gap: 8px;
    }

    .social-btn {
        height: 42px;
        font-size: 18px;
    }
}

/* Ajuste para o bloco da sidebar */
.news-sidebar .ads-banner {
    width: 100%;
    min-height: 250px; /* Garante um tamanho mínimo pro bloco */
}

#ad-img-sidebar_noticias {
    width: 100%;
    height: 350px; /* Altura "quadrada" para Desktop */
    object-fit: cover;
}

/* Ajuste Responsivo: No celular, ele volta a ser um banner deitada */
@media (max-width: 768px) {
    #ad-img-sidebar_noticias {
        height: 150px !important; 
    }
}/* ============================================================
   VT PULSE — NEWS ARCHIVE
   EDITORIAL SYSTEM
============================================================ */

:root {
    --primary: #ff3b8d;

    --bg: #030305;

    --surface: #09090e;

    --border:
        rgba(255,255,255,.08);

    --border-strong:
        rgba(255,255,255,.14);

    --muted: #6d6d77;
}


* {
    box-sizing:
        border-box;
}


body {
    margin: 0;

    background:
        var(--bg);

    color:
        #eeeef2;

    font-family:
        'Saira Condensed',
        sans-serif;
}



/* ============================================================
   CONTAINER
============================================================ */

.news-archive-container {
    width:
        min(
            1500px,
            calc(100% - 70px)
        );

    margin:
        0 auto;

    padding:
        75px 0
        130px;
}



/* ============================================================
   CABEÇALHO
============================================================ */

.archive-header {
    position:
        relative;

    margin-bottom:
        55px;
}


.archive-eyebrow {
    display:
        flex;

    align-items:
        center;

    gap: 13px;

    margin-bottom:
        13px;

    color:
        #5f5f68;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        2px;
}


.archive-eyebrow span {
    color:
        var(--primary);
}


.archive-title-row {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        40px;
}


.archive-header h1 {
    margin: 0;

    color:
        white;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        clamp(
            65px,
            8vw,
            125px
        );

    line-height:
        .88;

    letter-spacing:
        -4px;

    text-transform:
        uppercase;
}


.archive-header h1 span {
    color:
        var(--primary);
}


.archive-header p {
    max-width:
        470px;

    margin:
        25px 0 0;

    color:
        #777780;

    font-size:
        17px;

    line-height:
        1.4;
}


.archive-index {
    padding-bottom:
        7px;

    color:
        #44444c;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        2px;
}



/* ============================================================
   FILTROS
============================================================ */

.archive-controls {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        30px;

    margin-top:
        45px;

    padding:
        15px 0;

    border-top:
        1px solid
        var(--border);

    border-bottom:
        1px solid
        var(--border);
}


.category-pills {
    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    margin: 0;
}


.pill {
    position:
        relative;

    padding:
        9px 16px;

    border: 0;

    border-radius: 0;

    background:
        transparent;

    color:
        #666670;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        1.2px;

    cursor:
        pointer;

    transition:
        .25s ease;
}


.pill::after {
    content: "";

    position:
        absolute;

    left: 50%;
    right: 50%;
    bottom: 0;

    height:
        2px;

    background:
        var(--primary);

    transition:
        .25s ease;
}


.pill:hover {
    color:
        white;
}


.pill.active {
    color:
        white;

    background:
        rgba(255,255,255,.04);
}


.pill.active::after {
    left:
        15px;

    right:
        15px;
}


.archive-control-label {
    color:
        #44444c;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        2px;
}



/* ============================================================
   GRID PRINCIPAL
============================================================ */

.archive-grid {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        330px;

    gap:
        70px;

    align-items:
        start;
}


.main-feed {
    min-width: 0;
}



/* ============================================================
   DESTAQUE
============================================================ */

.big-news-card {
    position:
        relative;

    width:
        100%;

    height:
        560px;

    margin-bottom:
        55px;

    overflow:
        hidden;

    border:
        1px solid
        var(--border);

    border-radius:
        0;

    background:
        #09090d;

    cursor:
        pointer;
}


.big-news-card::before {
    content:
        "01 / DESTAQUE";

    position:
        absolute;

    top: 20px;
    left: 22px;

    z-index: 5;

    color:
        white;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        1.7px;
}


.big-news-card::after {
    content: "";

    position:
        absolute;

    top: 0;
    left: 0;

    width:
        3px;

    height:
        0;

    background:
        var(--primary);

    transition:
        height .4s ease;

    z-index:
        7;
}


.big-news-card:hover::after {
    height:
        100%;
}


.big-news-card img {
    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        cover;

    transition:
        transform .7s
        cubic-bezier(
            .2,.7,.2,1
        );
}


.big-news-card:hover img {
    transform:
        scale(1.035);
}


.big-content {
    position:
        absolute;

    inset: 0;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        flex-end;

    padding:
        45px;

    background:
        linear-gradient(
            to top,
            rgba(3,3,5,.98) 0%,
            rgba(3,3,5,.72) 38%,
            rgba(3,3,5,.08) 78%
        );
}


.tag {
    width:
        fit-content;

    color:
        var(--primary);

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        1.4px;

    text-transform:
        uppercase;
}


.big-content h2 {
    max-width:
        850px;

    margin:
        10px 0 12px;

    color:
        white;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        clamp(
            35px,
            4vw,
            58px
        );

    line-height:
        1;

    letter-spacing:
        -1px;

    text-transform:
        uppercase;
}


.big-content p {
    max-width:
        650px;

    margin:
        0 0 18px;

    color:
        #b1b1b8;

    font-size:
        15px;

    line-height:
        1.4;
}


.big-content small {
    color:
        #777780;

    font-size:
        10px;

    letter-spacing:
        .5px;

    text-transform:
        uppercase;
}



/* ============================================================
   LISTA EDITORIAL
============================================================ */

.news-horizontal-card {
    position:
        relative;

    display:
        grid;

    grid-template-columns:
        285px
        minmax(0, 1fr);

    min-height:
        195px;

    margin:
        0;

    padding:
        22px 0;

    gap:
        25px;

    overflow:
        hidden;

    background:
        transparent;

    border: 0;

    border-bottom:
        1px solid
        var(--border);

    border-radius:
        0;

    box-shadow:
        none;

    cursor:
        pointer;

    transition:
        .3s ease;
}


.news-horizontal-card:first-of-type {
    border-top:
        1px solid
        var(--border);
}


.news-horizontal-card::after {
    content:
        "→";

    position:
        absolute;

    right:
        4px;

    bottom:
        25px;

    color:
        var(--primary);

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        17px;

    opacity:
        0;

    transform:
        translateX(-8px);

    transition:
        .25s ease;
}


.news-horizontal-card:hover {
    transform:
        none;

    border-color:
        rgba(255,59,141,.4);
}


.news-horizontal-card:hover::after {
    opacity: 1;

    transform:
        translateX(0);
}


.horizontal-img-box {
    position:
        relative;

    width:
        100%;

    min-height:
        150px;

    overflow:
        hidden;

    background:
        #0a0a0e;
}


.horizontal-img-box::after {
    content: "";

    position:
        absolute;

    inset: 0;

    border:
        1px solid
        rgba(255,255,255,.06);

    pointer-events:
        none;
}


.horizontal-img-box img {
    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        cover;

    transition:
        transform .5s ease;
}


.news-horizontal-card:hover
.horizontal-img-box img {
    transform:
        scale(1.04);
}


.news-card-content {
    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    min-width:
        0;

    padding:
        4px 45px 4px 0;
}


.news-card-content h3 {
    max-width:
        650px;

    margin:
        8px 0;

    color:
        #eeeef2;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        clamp(
            20px,
            2vw,
            27px
        );

    line-height:
        1.1;

    text-transform:
        uppercase;

    transition:
        color .25s ease;
}


.news-horizontal-card:hover
.news-card-content h3 {
    color:
        white;
}


.horizontal-desc {
    display:
        -webkit-box;

    max-width:
        630px;

    margin:
        2px 0 12px;

    overflow:
        hidden;

    color:
        #777780;

    font-size:
        14px;

    line-height:
        1.35;

    line-clamp:
        2;

    box-orient:
        vertical;
}


.news-card-content small {
    color:
        #55555e;

    font-size:
        9px;

    letter-spacing:
        .7px;

    text-transform:
        uppercase;
}


.news-card-content small b {
    color:
        #8d8d95;
}



/* ============================================================
   SIDEBAR
============================================================ */

.news-sidebar {
    height:
        fit-content;
}


.sidebar-section {
    margin-bottom:
        50px;

    padding:
        0;

    background:
        transparent;

    border: 0;

    box-shadow:
        none;
}


.sidebar-heading {
    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    padding-bottom:
        14px;

    margin-bottom:
        22px;

    border-bottom:
        1px solid
        var(--border);
}


.sidebar-heading span {
    color:
        var(--primary);

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;
}


.sidebar-heading h3 {
    margin: 0;

    color:
        white;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        19px;

    text-transform:
        uppercase;
}



/* ============================================================
   MAIS LIDAS
============================================================ */

.trending-item {
    position:
        relative;

    display:
        grid;

    grid-template-columns:
        38px 1fr;

    gap:
        12px;

    margin:
        0;

    padding:
        15px 0;

    border-bottom:
        1px solid
        rgba(255,255,255,.055);

    cursor:
        pointer;
}


.trend-number {
    color:
        rgba(255,255,255,.1);

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        24px;

    line-height:
        1;
}


.trend-info h4 {
    margin:
        -2px 0 6px;

    color:
        #cfcfd4;

    font-family:
        'Saira Condensed',
        sans-serif;

    font-size:
        14px;

    line-height:
        1.2;

    transition:
        color .25s ease;
}


.trend-info small {
    color:
        #484850 !important;

    font-size:
        9px !important;

    text-transform:
        uppercase;
}


.trending-item:hover
.trend-number {
    color:
        var(--primary);
}


.trending-item:hover
.trend-info h4 {
    color:
        white;
}



/* ============================================================
   PUBLICIDADE
============================================================ */

.sidebar-micro-title {
    margin-bottom:
        9px;

    color:
        #44444c;

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        8px;

    font-weight:
        700;

    letter-spacing:
        2px;
}


.ads-banner {
    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    border:
        1px solid
        var(--border);

    background:
        #08080c;
}


.ads-banner a {
    display:
        block;
}


#ad-img-sidebar_archive {
    width:
        100%;

    height:
        350px !important;

    display:
        block;

    object-fit:
        cover;

    border-radius:
        0 !important;
}



/* ============================================================
   SOCIAL
============================================================ */

.sticky {
    position:
        sticky;

    top:
        90px;
}


.social-copy {
    margin:
        -5px 0 18px;

    color:
        #666670;

    font-size:
        13px;

    line-height:
        1.4;
}


.social-links {
    display:
        grid;

    grid-template-columns:
        repeat(5, 1fr);

    gap:
        6px;

    margin: 0;
}


.social-btn {
    height:
        45px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        var(--border);

    border-radius:
        0;

    background:
        #08080c;

    color:
        #777780;

    font-size:
        15px;

    text-decoration:
        none;

    transition:
        .25s ease;
}


.social-btn:hover {
    transform:
        translateY(-3px);

    color:
        white;

    border-color:
        var(--primary);

    background:
        rgba(255,59,141,.08);

    box-shadow:
        none;
}



/* ============================================================
   EMPTY STATE
============================================================ */

.main-feed > p {
    padding:
        70px 0 !important;

    color:
        #666670;

    font-size:
        16px;

    border-top:
        1px solid
        var(--border);

    border-bottom:
        1px solid
        var(--border);
}



/* ============================================================
   RESPONSIVO
============================================================ */

@media (max-width: 1100px) {

    .archive-grid {
        grid-template-columns:
            minmax(0, 1fr)
            280px;

        gap:
            40px;
    }


    .news-horizontal-card {
        grid-template-columns:
            230px
            minmax(0, 1fr);
    }

}



@media (max-width: 900px) {

    .news-archive-container {
        width:
            calc(100% - 30px);

        padding:
            50px 0 80px;
    }


    .archive-title-row {
        display:
            block;
    }


    .archive-header h1 {
        font-size:
            clamp(
                58px,
                15vw,
                90px
            );

        letter-spacing:
            -2px;

        text-align:
            left;
    }


    .archive-index {
        display:
            none;
    }


    .archive-grid {
        grid-template-columns:
            1fr;

        gap:
            70px;
    }


    .big-news-card {
        height:
            450px;
    }


    .news-sidebar {
        display:
            grid;

        grid-template-columns:
            1fr 1fr;

        gap:
            35px;
    }


    .sidebar-section {
        margin:
            0;
    }


    .sidebar-section:last-child {
        grid-column:
            1 / -1;
    }


    .sticky {
        position:
            static;
    }

}



@media (max-width: 650px) {

    .news-archive-container {
        padding-top:
            40px;
    }


    .archive-header {
        margin-bottom:
            35px;
    }


    .archive-header p {
        margin-top:
            18px;

        font-size:
            15px;
    }


    .archive-controls {
        align-items:
            flex-start;

        flex-direction:
            column-reverse;

        gap:
            8px;

        margin-top:
            30px;
    }


    .category-pills {
        width:
            100%;

        overflow-x:
            auto;

        scrollbar-width:
            none;
    }


    .category-pills::-webkit-scrollbar {
        display:
            none;
    }


    .pill {
        flex:
            0 0 auto;
    }


    .big-news-card {
        height:
            430px;

        margin-bottom:
            35px;
    }


    .big-content {
        padding:
            25px;
    }


    .big-content h2 {
        font-size:
            clamp(
                30px,
                9vw,
                43px
            );
    }


    .big-content p {
        display:
            -webkit-box;

        overflow:
            hidden;

        -line-clamp:
            3;

        -webkit-box-orient:
            vertical;
    }


    .news-horizontal-card {
        display:
            grid;

        grid-template-columns:
            125px
            minmax(0, 1fr);

        min-height:
            150px;

        gap:
            14px;

        padding:
            14px 0;
    }


    .horizontal-img-box {
        min-height:
            120px;
    }


    .news-card-content {
        padding:
            0 15px 0 0;
    }


    .news-card-content h3 {
        display:
            -webkit-box;

        margin:
            5px 0 9px;

        overflow:
            hidden;

        font-size:
            18px;

        line-clamp:
            3;

        -webkit-box-orient:
            vertical;
    }


    .horizontal-desc {
        display:
            none;
    }


    .news-horizontal-card::after {
        display:
            none;
    }


    .news-sidebar {
        display:
            block;
    }


    .sidebar-section {
        margin-bottom:
            50px;
    }


    #ad-img-sidebar_archive {
        height:
            180px !important;
    }

}

.article-index {
    position:
        absolute;

    top: 10px;
    left: 11px;

    z-index:
        3;

    color:
        rgba(255,255,255,.72);

    font-family:
        'Oswald',
        sans-serif;

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        1px;

    text-shadow:
        0 1px 8px
        rgba(0,0,0,.8);
}

/* ============================================================
   PAGINAÇÃO
============================================================ */

.news-pagination {

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 25px;

    margin-top: 45px;

    padding-top: 25px;

    border-top:
        1px solid var(--border);
}


.page-numbers {
    display: flex;

    align-items: center;

    gap: 4px;
}


.page-number,
.page-nav {
    border: 0;

    background: transparent;

    color: #55555e;

    font-family:
        'Oswald',
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1px;

    cursor: pointer;

    transition:
        .25s ease;
}


.page-number {
    position: relative;

    width: 34px;
    height: 34px;
}


.page-number::after {
    content: "";

    position: absolute;

    left: 50%;
    right: 50%;
    bottom: 2px;

    height: 2px;

    background: var(--primary);

    transition: .25s ease;
}


.page-number:hover,
.page-number.active,
.page-nav:hover {
    color: white;
}


.page-number.active::after {
    left: 8px;
    right: 8px;
}


.page-nav {
    min-width: 85px;
}


.page-nav:disabled {
    opacity: .2;

    cursor: default;
}


.page-nav:disabled:hover {
    color: #55555e;
}


@media (max-width: 650px) {

    .news-pagination {
        gap: 10px;
    }

    .page-nav {
        font-size: 8px;
        min-width: 60px;
    }

    .page-number {
        width: 28px;
        height: 28px;

        font-size: 9px;
    }

}

/* ============================================================
   FIX — LAYOUT DO ARQUIVO / SIDEBAR NO TOPO
============================================================ */

.news-archive-container {
    width: min(1200px, calc(100% - 40px));
    max-width: none;
    margin: 40px auto 100px;
    padding: 0;
}

.archive-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 40px;
    align-items: start;
}

.main-feed {
    min-width: 0;
    padding: 0;
    margin: 0;
}

.news-sidebar {
    min-width: 0;
    height: auto;
    align-self: start;
    margin: 0;
    padding: 0;
}

/* Deixa a lateral inteira acompanhar a rolagem,
   em vez de somente o último bloco */
@media (min-width: 901px) {
    .news-sidebar {
        position: sticky;
        top: 90px;
    }

    .news-sidebar .sticky {
        position: static;
    }
}

/* Impede margens extras dos banners */
.news-sidebar .ads-banner {
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
}

.news-sidebar .sidebar-box {
    width: 100%;
}

/* Seu slot real é sidebar_archive */
#ad-img-sidebar_archive {
    width: 100%;
    height: 350px;
    object-fit: cover;
    display: block;
}

/* MOBILE */
@media (max-width: 900px) {
    .news-archive-container {
        width: calc(100% - 30px);
        margin: 25px auto 70px;
    }

    .archive-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .news-sidebar {
        position: static;
        order: 2;
    }

    #ad-img-sidebar_archive {
        height: 150px !important;
    }
}