@import url("base.css");
@import url("editorial.css");
@import url("content.css");
@import url("responsive.css");
@import url("configurable.css");
@import url("demo.css");
@import url("ads.css");

/* Shared hero treatment for pages, categories and offshore jobs. */
.page-hero,
.archive-hero,
.jobs-archive-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:310px;
    padding:70px 0;
    background-color:#050505;
    background-image:linear-gradient(rgba(0,0,0,.8),rgba(0,0,0,.8)),url("https://images.unsplash.com/photo-1723435732442-c0a7ca08e7e9?auto=format&fit=crop&w=2400&q=82");
    background-size:cover;
    background-position:center 52%;
    background-repeat:no-repeat;
    color:#fff;
    border-bottom:5px solid var(--peao-yellow);
}

.page-hero>.container,
.archive-hero>.container,
.jobs-archive-hero>.container{
    position:relative;
    z-index:1;
}

.page-hero h1,
.archive-hero h1,
.jobs-archive-hero h1{
    font-size:clamp(2.6rem,6vw,4rem);
    line-height:.98;
    text-shadow:0 2px 18px rgba(0,0,0,.45);
}

.single-header h1{
    font-size:clamp(2.4rem,6vw,4rem);
}

/* Centraliza o menu no espaço real entre a marca e as ações do cabeçalho. */
@media(min-width:992px){
    .header-main-shell .nav-menu-wrap{
        display:flex;
        align-items:center;
        justify-content:center;
    }

    .header-main-shell .primary-menu{
        justify-content:center;
    }
}

/* Banner 300x250 abaixo do bloco amarelo da lateral das notícias. */
.sidebar-ad-panel{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
}

.sidebar-ad-label{
    display:block;
    margin:0 0 6px;
    text-align:center;
    font-size:.6rem;
    font-weight:700;
    line-height:1;
    letter-spacing:.12em;
    text-transform:uppercase;
}

/*
 * Imagens editoriais: padrão mestre 1600x900 (16:9).
 * Nunca ampliamos/cortamos a arte para preencher um frame: imagens fora do padrão
 * são encaixadas integralmente sobre fundo neutro. Isso protege textos, logos e
 * informações que eventualmente estejam dentro da imagem.
 */
.hero-main{
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    background-color:#090909;
}

.news-card-media,
.hero-side .news-card-media,
.hero-under-main--three .news-card--compact .news-card-media,
.hero-layout-3 .hero-side-feature .news-card-media{
    width:100%;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    align-self:start;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    background-color:#111;
}

.single-featured img{
    display:block;
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
    border-radius:18px;
    background:#111;
}

@media(max-width:767px){
    .page-hero,
    .archive-hero,
    .jobs-archive-hero{
        min-height:235px;
        padding:44px 0;
        background-position:center center;
    }

    .page-hero h1,
    .archive-hero h1,
    .jobs-archive-hero h1{
        font-size:clamp(2rem,11vw,3.25rem);
        letter-spacing:-.045em;
    }
}