
/* ==============================================================
   GHOSTBASE 2.0 — INTEGRAÇÃO V8
   --------------------------------------------------------------
   Esta folha NÃO muda rotas, consultas, ordem ou posição de banner.
   Apenas conecta o tema Orange às classes reais do portal atual.
   ============================================================== */

:root{
    --gb-header-h:76px;
}

/* ---------- estrutura atual ---------- */
body{
    font-size:16px;
}

.site-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(8,12,15,.93)!important;
    border-bottom:1px solid var(--gb-line)!important;
    backdrop-filter:blur(16px);
}

.nav-shell{
    width:min(calc(100% - 36px),var(--gb-max))!important;
    max-width:var(--gb-max)!important;
    min-height:var(--gb-header-h)!important;
    height:auto!important;
    display:flex;
    align-items:center;
    gap:28px;
    margin-inline:auto;
}

.brand{
    min-width:230px;
    display:flex;
    align-items:center;
    gap:11px;
    text-decoration:none;
}

.brand-logo-image{
    width:48px!important;
    height:48px!important;
    flex:0 0 48px;
    overflow:hidden;
    border-radius:12px;
    display:grid!important;
    place-items:center;
    background:#0d1317;
    border:1px solid #26333c;
}

.brand-logo-image img{
    width:100%!important;
    height:100%!important;
    max-width:48px!important;
    max-height:48px!important;
    object-fit:contain!important;
}

.brand-emblem{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:linear-gradient(135deg,var(--gb-orange),#f25300);
    color:#0a0d0f;
    font-weight:950;
}

.brand strong{
    display:block;
    color:#fff;
    letter-spacing:1.2px;
    line-height:1.05;
}

.brand small{
    display:block;
    margin-top:4px;
    color:#7f909a;
    font-size:9px;
}

.main-nav{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:19px;
}

.main-nav > a,
.nav-drop > button{
    min-height:auto!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#c7d0d6!important;
    font-size:13px!important;
    font-weight:800!important;
    transform:none!important;
}

.main-nav > a:hover,
.nav-drop > button:hover{
    color:#fff!important;
}

.store-link{
    color:#fff!important;
}

.mobile-toggle{
    display:none;
    width:44px;
    height:44px;
    min-height:44px;
    margin-left:auto;
    padding:0;
    border:1px solid #293740!important;
    background:#0c1216!important;
    box-shadow:none!important;
}

/* Dropdowns */
.nav-drop{
    position:relative;
}

.drop-menu{
    min-width:210px;
    padding:8px;
    border:1px solid #293740;
    border-radius:13px;
    background:#0b1115;
    box-shadow:0 24px 60px rgba(0,0,0,.45);
}

.drop-menu a{
    display:block;
    padding:10px 11px;
    border-radius:8px;
}

.drop-menu a:hover{
    background:rgba(255,107,0,.08);
    color:#fff;
}

/* ---------- Home intro ---------- */
.home-intro{
    padding:46px 0!important;
    border-bottom:1px solid var(--gb-line);
    background:
        linear-gradient(180deg,#0b1014,#090d10);
}

.home-intro-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr)!important;
    gap:50px!important;
    align-items:end!important;
}

.home-intro h2{
    margin:0;
    max-width:770px;
    font-size:clamp(30px,3.8vw,50px);
    line-height:1.02;
    letter-spacing:-1.4px;
}

.home-intro p{
    margin:0;
    color:#97a7b1;
    line-height:1.7;
}

/* ---------- seções atuais ---------- */
.section{
    padding:72px 0!important;
}

.section-alt{
    background:#0b1014!important;
    border-block:1px solid rgba(255,255,255,.035);
}

.section-head{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:24px!important;
    margin-bottom:27px!important;
}

.section-head > div{
    min-width:0;
}

.section-head h2{
    margin:4px 0 0!important;
    font-size:clamp(29px,3.1vw,44px)!important;
    line-height:1.05!important;
}

.section-head p{
    margin:8px 0 0!important;
    color:#8998a4!important;
}

.section-head > a{
    flex:0 0 auto;
    color:#ff893b;
    font-size:12px;
    font-weight:900;
    text-decoration:none;
}

/* ---------- kicker/meta ---------- */
.kicker,
.meta{
    color:var(--gb-orange)!important;
    font-weight:950!important;
    letter-spacing:1.3px!important;
    text-transform:uppercase!important;
}

/* ---------- grids atuais ---------- */
.grid{
    display:grid!important;
    gap:18px!important;
}

.grid-4{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

/* ---------- operações atuais ---------- */
.event-card{
    height:100%;
    display:flex!important;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--gb-line)!important;
    border-radius:16px!important;
    background:linear-gradient(180deg,#12191f,#0f151a)!important;
    box-shadow:0 18px 50px rgba(0,0,0,.24)!important;
}

.event-card .media{
    position:relative;
    width:100%;
    aspect-ratio:4/3;
    overflow:hidden;
    background:#06090b;
}

.event-card .media img{
    width:100%!important;
    height:100%!important;
    display:block;
    object-fit:cover!important;
}

.date-chip{
    position:absolute;
    top:13px;
    left:13px;
    z-index:2;
    padding:8px 10px;
    border-radius:9px;
    background:#ff6b00;
    color:#fff;
    font-size:10px;
    font-weight:950;
    box-shadow:0 8px 24px rgba(0,0,0,.28);
}

.event-card .card-body{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:18px!important;
}

.event-card h3{
    margin:7px 0 9px;
    font-size:19px;
    line-height:1.22;
}

.event-card p{
    flex:1;
    color:#8998a4;
    line-height:1.55;
}

.card-link{
    color:#ff8126;
    font-size:11px;
    font-weight:950;
    text-decoration:none;
}

/* ---------- banner CMS: NÃO MUDA SLOT ---------- */
.gb-banner-slider{
    width:100%!important;
    max-width:100%!important;
    position:relative!important;
    overflow:hidden!important;
    background:#080c0f!important;
    border-block:1px solid rgba(255,255,255,.04);
}

/*
 * Nenhum:
 * order
 * grid-area
 * absolute externo
 * reparent
 * JS de movimentação
 *
 * A posição continua 100% determinada pelo ADM.
 */

.gb-banner-track{
    position:relative!important;
    width:100%!important;
    overflow:hidden!important;
}

.gb-banner-slide{
    overflow:hidden!important;
}

.gb-banner-slider--hero,
.gb-banner-slider--hero .gb-banner-track,
.gb-banner-slider--hero .gb-banner-slide{
    height:clamp(430px,48vw,680px)!important;
    min-height:430px!important;
}

.gb-banner-slider--page,
.gb-banner-slider--page .gb-banner-track,
.gb-banner-slider--page .gb-banner-slide{
    height:clamp(270px,29vw,460px)!important;
    min-height:270px!important;
}

.gb-banner-slider--compact,
.gb-banner-slider--compact .gb-banner-track,
.gb-banner-slider--compact .gb-banner-slide{
    height:clamp(250px,28vw,430px)!important;
    min-height:250px!important;
}

.gb-banner-media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
}

.gb-banner-media img,
.gb-banner-media video{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center!important;
}

.gb-banner-slide.is-portrait .gb-banner-media img,
.gb-banner-slide.is-landscape .gb-banner-media img{
    object-fit:contain!important;
}

.gb-banner-content{
    position:relative!important;
    z-index:4!important;
    height:100%;
    display:flex;
    align-items:center;
}

.gb-banner-copy{
    max-width:720px;
    padding-block:40px;
}

.gb-banner-copy h1{
    margin:0;
    font-size:clamp(38px,5.2vw,72px);
    line-height:.98;
}

.gb-banner-copy h2{
    margin:9px 0 0;
    font-size:clamp(20px,2.4vw,32px);
}

.gb-banner-copy p{
    max-width:640px;
    color:#c0c9ce;
    line-height:1.6;
}

.gb-banner-dots{
    z-index:10!important;
}

.gb-banner-arrow{
    z-index:10!important;
}

/* home_meio continua no ponto onde a view o imprime */
.gb-home-banner-middle{
    padding:52px 0!important;
    background:#080c0f;
}

/* ---------- notícias atuais ---------- */
.news-layout{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr)!important;
    gap:20px!important;
}

.feature-card{
    position:relative;
    min-height:520px;
    overflow:hidden;
    border:1px solid var(--gb-line);
    border-radius:18px;
    background:#0d1317;
}

.feature-card > img{
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
}

.feature-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(5,8,10,.97),rgba(5,8,10,.14) 68%);
}

.feature-copy{
    position:absolute;
    z-index:2;
    left:0;
    right:0;
    bottom:0;
    padding:28px;
}

.feature-copy h3{
    margin:11px 0;
    max-width:760px;
    font-size:clamp(25px,3vw,40px);
    line-height:1.08;
}

.feature-copy p{
    max-width:700px;
    color:#b0bdc4;
}

.feature-copy a{
    color:#ff8126;
    font-weight:900;
    text-decoration:none;
}

.pill{
    display:inline-flex;
    padding:6px 9px;
    border-radius:999px;
    background:rgba(255,107,0,.13);
    border:1px solid rgba(255,107,0,.34);
    color:#ff9a56;
    font-size:9px;
    font-weight:950;
}

.news-stack{
    display:grid;
    align-content:start;
    gap:10px;
}

.news-row{
    display:grid!important;
    grid-template-columns:116px minmax(0,1fr)!important;
    gap:13px;
    align-items:center;
    padding:10px;
    border:1px solid #202b33;
    border-radius:13px;
    background:#0d1317;
    text-decoration:none;
}

.news-row img{
    width:116px!important;
    height:84px!important;
    border-radius:9px;
    object-fit:cover!important;
}

.news-row span{
    display:block;
    margin-bottom:6px;
    color:#788b96;
    font-size:9px;
}

.news-row strong{
    display:block;
    line-height:1.25;
}

/* ---------- equipes atuais ---------- */
.identity-card{
    display:grid!important;
    grid-template-columns:128px minmax(0,1fr)!important;
    gap:17px!important;
    align-items:center;
    min-height:180px;
    padding:16px!important;
    border:1px solid var(--gb-line)!important;
    border-radius:16px!important;
    background:linear-gradient(180deg,#12191f,#0f151a)!important;
}

.identity-card > img{
    width:128px!important;
    height:128px!important;
    max-width:128px!important;
    max-height:128px!important;
    padding:8px;
    border-radius:13px;
    background:#090d10;
    object-fit:contain!important;
}

.identity-card h3{
    margin:6px 0 8px;
    font-size:20px;
}

.identity-card p{
    color:#8998a4;
    line-height:1.55;
}

.identity-card a{
    color:#ff8126;
    font-size:11px;
    font-weight:900;
    text-decoration:none;
}

/* ---------- operadores atuais ---------- */
.operator-card{
    position:relative!important;
    min-height:430px!important;
    overflow:hidden!important;
    border:1px solid var(--gb-line)!important;
    border-radius:17px!important;
    background:#0d1317;
}

.operator-card > img{
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center top!important;
}

.operator-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(5,8,10,.98),rgba(5,8,10,.08) 68%);
}

.operator-overlay{
    position:absolute;
    z-index:2;
    left:0;
    right:0;
    bottom:0;
    padding:22px;
}

.operator-overlay span{
    color:#ff8126;
    font-size:10px;
    font-weight:900;
}

.operator-overlay h3{
    margin:5px 0;
    font-size:25px;
}

.operator-overlay p{
    margin:0 0 10px;
    color:#a8b4bc;
}

.operator-overlay a{
    color:#ff8126;
    font-size:11px;
    font-weight:900;
    text-decoration:none;
}

/* ---------- CTA ---------- */
.split-cta{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:34px!important;
    align-items:center!important;
    padding:34px!important;
    border:1px solid #26333c;
    border-radius:20px;
    background:
        radial-gradient(600px 240px at 80% 30%,rgba(255,107,0,.12),transparent 68%),
        #0e1519;
}

.split-cta h2{
    margin:6px 0 8px;
    font-size:clamp(28px,3vw,42px);
}

.split-cta p{
    max-width:760px;
    color:#8998a4;
}

.cta-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

/* ---------- footer ---------- */
.site-footer{
    margin-top:0!important;
    background:#070a0c!important;
    border-top:1px solid var(--gb-line)!important;
}

.footer-grid{
    display:grid!important;
    grid-template-columns:minmax(270px,2fr) repeat(3,minmax(140px,1fr))!important;
    gap:42px!important;
}

.footer-grid > div{
    min-width:0;
}

.footer-grid h4{
    margin:0 0 14px;
}

.footer-grid > div:not(:first-child) a{
    display:block;
    margin:8px 0;
    color:#8998a4;
    font-size:12px;
}

.footer-bottom{
    margin-top:34px!important;
    padding-top:20px!important;
    border-top:1px solid #202b33;
    color:#657680;
    font-size:10px;
}

/* ---------- hero sem operador cadastrado ---------- */
.gb-hero-watermark{
    position:absolute;
    right:0;
    bottom:12%;
    color:rgba(255,255,255,.035);
    font-size:clamp(72px,10vw,170px);
    line-height:.72;
    font-weight:950;
    letter-spacing:-8px;
    user-select:none;
}

.gb-hero-watermark small{
    display:block;
    color:rgba(255,107,0,.12);
    font-size:.45em;
    text-align:right;
    letter-spacing:-3px;
}

/* ==============================================================
   RESPONSIVO REAL — respeita a mesma topologia do desktop
   ============================================================== */

@media(max-width:1180px){
    .grid-4{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .grid-3{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .main-nav{
        gap:13px;
    }

    .brand{
        min-width:195px;
    }
}

@media(max-width:980px){
    .mobile-toggle{
        display:grid!important;
        place-items:center;
    }

    .main-nav{
        position:absolute;
        top:calc(100% + 1px);
        left:14px;
        right:14px;
        display:none;
        flex-direction:column;
        align-items:stretch;
        gap:0;
        max-height:calc(100vh - 94px);
        overflow:auto;
        padding:12px;
        border:1px solid #293740;
        border-radius:14px;
        background:#090e12;
        box-shadow:0 26px 70px rgba(0,0,0,.55);
    }

    .main-nav.is-open,
    .main-nav.open,
    .main-nav[data-open="1"]{
        display:flex!important;
    }

    .main-nav > a,
    .nav-drop > button{
        width:100%;
        min-height:44px!important;
        display:flex!important;
        align-items:center;
        justify-content:flex-start!important;
        padding:0 11px!important;
        border-radius:8px!important;
    }

    .nav-drop{
        width:100%;
    }

    .drop-menu{
        position:static!important;
        width:100%;
        min-width:0;
        margin:2px 0 8px;
        box-shadow:none;
    }

    .home-intro-inner{
        grid-template-columns:1fr!important;
        gap:18px!important;
    }

    .news-layout{
        grid-template-columns:1fr!important;
    }

    .news-stack{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .split-cta{
        grid-template-columns:1fr!important;
    }

    .footer-grid{
        grid-template-columns:1fr 1fr!important;
    }
}

@media(max-width:720px){
    :root{
        --gb-header-h:68px;
    }

    .container,
    .nav-shell{
        width:calc(100% - 26px)!important;
    }

    .brand{
        min-width:0;
    }

    .brand-logo-image{
        width:42px!important;
        height:42px!important;
        flex-basis:42px;
    }

    .brand-logo-image img{
        max-width:42px!important;
        max-height:42px!important;
    }

    .brand small{
        max-width:165px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .section{
        padding:52px 0!important;
    }

    .section-head{
        flex-direction:column!important;
        align-items:flex-start!important;
    }

    .grid-4,
    .grid-3{
        grid-template-columns:1fr!important;
    }

    .gb-banner-slider--hero,
    .gb-banner-slider--hero .gb-banner-track,
    .gb-banner-slider--hero .gb-banner-slide{
        height:360px!important;
        min-height:360px!important;
    }

    .gb-banner-slider--page,
    .gb-banner-slider--page .gb-banner-track,
    .gb-banner-slider--page .gb-banner-slide{
        height:280px!important;
        min-height:280px!important;
    }

    .gb-banner-slider--compact,
    .gb-banner-slider--compact .gb-banner-track,
    .gb-banner-slider--compact .gb-banner-slide{
        height:260px!important;
        min-height:260px!important;
    }

    .gb-banner-copy{
        max-width:calc(100vw - 74px);
    }

    .gb-banner-copy h1{
        font-size:clamp(32px,10vw,48px);
    }

    .feature-card{
        min-height:470px;
    }

    .feature-copy{
        padding:20px;
    }

    .news-stack{
        grid-template-columns:1fr;
    }

    .news-row{
        grid-template-columns:96px minmax(0,1fr)!important;
    }

    .news-row img{
        width:96px!important;
        height:76px!important;
    }

    .identity-card{
        grid-template-columns:98px minmax(0,1fr)!important;
        min-height:0;
    }

    .identity-card > img{
        width:98px!important;
        height:98px!important;
        max-width:98px!important;
        max-height:98px!important;
    }

    .operator-card{
        min-height:390px!important;
    }

    .footer-grid{
        grid-template-columns:1fr!important;
    }

    .cta-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .cta-actions .btn{
        width:100%;
    }
}

@media(max-width:440px){
    body{
        font-size:15px;
    }

    .container,
    .nav-shell{
        width:calc(100% - 20px)!important;
    }

    .brand strong{
        font-size:13px;
    }

    .brand small{
        max-width:130px;
        font-size:8px;
    }

    .gb-banner-slider--hero,
    .gb-banner-slider--hero .gb-banner-track,
    .gb-banner-slider--hero .gb-banner-slide{
        height:320px!important;
        min-height:320px!important;
    }

    .gb-banner-slider--page,
    .gb-banner-slider--page .gb-banner-track,
    .gb-banner-slider--page .gb-banner-slide,
    .gb-banner-slider--compact,
    .gb-banner-slider--compact .gb-banner-track,
    .gb-banner-slider--compact .gb-banner-slide{
        height:225px!important;
        min-height:225px!important;
    }

    .identity-card{
        grid-template-columns:82px minmax(0,1fr)!important;
        gap:13px!important;
    }

    .identity-card > img{
        width:82px!important;
        height:82px!important;
        max-width:82px!important;
        max-height:82px!important;
    }

    .event-card .media{
        aspect-ratio:16/10;
    }

    .operator-card{
        min-height:360px!important;
    }

    .split-cta{
        padding:24px!important;
    }
}
