/* ============================================================
   GHOSTBASE V23.2 — BANNER SLIDER PREMIUM
   Somente o componente .gb-banner-slider
   ============================================================ */

.gb-banner-slider{
    position:relative!important;
    overflow:hidden!important;
    border-radius:22px!important;
    border:1px solid rgba(255,255,255,.08)!important;

    background:#080c0f!important;

    box-shadow:
        0 28px 70px rgba(0,0,0,.42),
        0 10px 28px rgba(0,0,0,.30),
        0 0 0 1px rgba(255,106,0,.025)!important;
}

/* Glow discreto laranja por trás */
.gb-banner-slider::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:8%;
    right:8%;
    bottom:-26px;
    height:70px;
    border-radius:50%;
    background:rgba(255,106,0,.18);
    filter:blur(34px);
    opacity:.55;
    pointer-events:none;
}

/* acabamento inferior */
.gb-banner-slider::after{
    content:"";
    position:absolute;
    z-index:14;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,106,0,.78) 18%,
            rgba(255,106,0,.22) 55%,
            transparent
        );
    pointer-events:none;
}

.gb-banner-track{
    border-radius:inherit!important;
    overflow:hidden!important;
}

/* Fade + micro movimento cinematográfico */
.gb-banner-slide{
    opacity:0!important;
    visibility:hidden!important;

    transform:scale(1.025)!important;

    transition:
        opacity .85s ease,
        visibility .85s ease,
        transform 6.2s ease-out!important;
}

.gb-banner-slide.is-active{
    opacity:1!important;
    visibility:visible!important;
    transform:scale(1)!important;
}

/* Imagem ativa ganha leve movimento sem parecer zoom agressivo */
.gb-banner-slide .gb-banner-media img{
    transform:scale(1.018);
    transition:transform 6s ease-out, filter .65s ease!important;
    filter:
        saturate(.96)
        contrast(1.03)
        brightness(.94);
}

.gb-banner-slide.is-active .gb-banner-media img{
    transform:scale(1.045);
    filter:
        saturate(1.03)
        contrast(1.05)
        brightness(.98);
}

/* mais profundidade sem escurecer demais a arte */
.gb-banner-overlay{
    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.03) 0%,
            rgba(0,0,0,.00) 50%,
            rgba(0,0,0,.26) 100%
        )!important;
}

/* se houver texto no banner, acrescenta contraste lateral */
.gb-banner-slide:has(.gb-banner-copy) .gb-banner-overlay{
    background:
        linear-gradient(
            90deg,
            rgba(4,7,9,.82) 0%,
            rgba(4,7,9,.42) 38%,
            rgba(4,7,9,.08) 70%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.04),
            rgba(0,0,0,.20)
        )!important;
}

/* setas mais premium */
.gb-banner-arrow{
    width:46px!important;
    height:46px!important;

    border:1px solid rgba(255,255,255,.18)!important;
    background:rgba(7,11,14,.52)!important;
    color:#fff!important;

    opacity:.22!important;

    box-shadow:
        0 12px 28px rgba(0,0,0,.30)!important;

    backdrop-filter:blur(12px)!important;

    transition:
        opacity .18s ease,
        transform .18s ease,
        background .18s ease,
        border-color .18s ease!important;
}

.gb-banner-slider:hover .gb-banner-arrow{
    opacity:.92!important;
}

.gb-banner-arrow:hover{
    background:#ff6a00!important;
    border-color:#ff6a00!important;
    color:#080b0d!important;
}

.gb-banner-prev:hover{
    transform:translateY(-50%) translateX(-2px)!important;
}

.gb-banner-next:hover{
    transform:translateY(-50%) translateX(2px)!important;
}

/* dots */
.gb-banner-dots{
    z-index:15!important;
}

.gb-banner-dots button{
    width:7px!important;
    height:7px!important;

    border:0!important;
    border-radius:999px!important;

    background:rgba(255,255,255,.36)!important;

    transition:
        width .20s ease,
        background .20s ease!important;
}

.gb-banner-dots button.is-active{
    width:28px!important;
    background:#ff6a00!important;
}

/* barra inferior de tempo */
.gb-banner-progress{
    z-index:16!important;
    height:3px!important;
    background:rgba(255,255,255,.06)!important;
}

.gb-banner-progress span{
    background:
        linear-gradient(
            90deg,
            #ff6a00,
            #ff9d52
        )!important;

    box-shadow:
        0 0 14px rgba(255,106,0,.48);
}

/* Hero da home respeita largura do modelo atual */
.gb-banner-slider--hero{
    width:min(calc(100% - 48px),1360px)!important;
    max-width:1360px!important;
    margin:42px auto 54px!important;
}

/* intermediário continua dentro do container */
.gb-banner-slider--compact{
    width:100%!important;
}

/* celular */
@media(max-width:720px){

    .gb-banner-slider{
        border-radius:14px!important;
    }

    .gb-banner-slider--hero{
        width:calc(100% - 24px)!important;
        margin:22px auto 34px!important;
    }

    .gb-banner-arrow{
        width:38px!important;
        height:38px!important;
    }

    .gb-banner-dots button.is-active{
        width:22px!important;
    }
}

/* respeita preferência de acessibilidade */
@media(prefers-reduced-motion:reduce){

    .gb-banner-slide,
    .gb-banner-media img{
        transition:none!important;
        transform:none!important;
    }
}


/* ============================================================
   GHOSTBASE V23.3 — CORREÇÃO ESTRUTURAL DO CARROSSEL
   Os slides precisam ocupar exatamente o mesmo palco.
   ============================================================ */

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

.gb-banner-slide{
    position:absolute!important;
    inset:0!important;

    width:100%!important;
    height:100%!important;

    margin:0!important;
    padding:0!important;

    pointer-events:none!important;
}

.gb-banner-slide.is-active{
    position:absolute!important;
    inset:0!important;

    pointer-events:auto!important;
    z-index:3!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;
}

.gb-banner-backdrop{
    position:absolute!important;
}

.gb-banner-overlay{
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    pointer-events:none!important;
}

.gb-banner-content{
    position:relative!important;
    z-index:5!important;
    height:100%!important;
}

/* controles sempre acima dos slides */
.gb-banner-arrow{
    z-index:20!important;
}

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

.gb-banner-progress{
    z-index:22!important;
}

/* Evita flash do segundo slide antes do JS iniciar */
.gb-banner-slide:not(.is-active){
    opacity:0!important;
    visibility:hidden!important;
}

.gb-banner-slide.is-active{
    opacity:1!important;
    visibility:visible!important;
}


/* ============================================================
   GHOSTBASE V23.4 — MÍDIA VISÍVEL + SOMBRA PREMIUM
   ============================================================ */

/* Neutraliza o z-index negativo herdado do CSS profissional antigo */
.gb-banner-slide{
    background:#070b0e!important;
    isolation:isolate!important;
}

.gb-banner-backdrop{
    z-index:0!important;
    opacity:.48!important;
}

.gb-banner-media{
    z-index:1!important;
    opacity:1!important;
    visibility:visible!important;
}

.gb-banner-overlay{
    z-index:4!important;
}

/* Conteúdo e controles ficam acima da imagem */
.gb-banner-content{
    z-index:6!important;
}

/* A imagem nunca deve desaparecer durante a troca */
.gb-banner-slide .gb-banner-media,
.gb-banner-slide .gb-banner-media img,
.gb-banner-slide .gb-banner-media video{
    opacity:1!important;
    visibility:visible!important;
}

/*
 * Sombreado/vinheta real sobre a arte.
 * Dá profundidade sem esconder o banner.
 */
.gb-banner-overlay{
    background:
        radial-gradient(
            ellipse at center,
            transparent 46%,
            rgba(0,0,0,.10) 70%,
            rgba(0,0,0,.32) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.13) 0%,
            transparent 25%,
            transparent 66%,
            rgba(0,0,0,.34) 100%
        )!important;
}

/* Quando houver copy, reforça contraste à esquerda */
.gb-banner-slide:has(.gb-banner-copy) .gb-banner-overlay{
    background:
        linear-gradient(
            90deg,
            rgba(4,7,9,.72) 0%,
            rgba(4,7,9,.28) 38%,
            rgba(4,7,9,.04) 68%
        ),
        radial-gradient(
            ellipse at center,
            transparent 45%,
            rgba(0,0,0,.12) 76%,
            rgba(0,0,0,.34) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.10),
            transparent 45%,
            rgba(0,0,0,.30)
        )!important;
}

/* Sombra externa realmente perceptível no fundo preto */
.gb-banner-slider{
    border:1px solid rgba(255,255,255,.10)!important;

    box-shadow:
        0 34px 80px rgba(0,0,0,.72),
        0 16px 34px rgba(0,0,0,.48),
        0 0 38px rgba(255,106,0,.10),
        inset 0 0 0 1px rgba(255,255,255,.018)!important;
}

/* halo laranja na base, dentro do elemento para não ser cortado */
.gb-banner-slider::after{
    height:3px!important;
    background:
        linear-gradient(
            90deg,
            #ff6a00 0%,
            rgba(255,106,0,.90) 22%,
            rgba(255,142,60,.38) 48%,
            rgba(255,106,0,.08) 78%,
            transparent 100%
        )!important;

    box-shadow:
        0 -4px 18px rgba(255,106,0,.24)!important;
}

/* imagem com acabamento fotográfico discreto */
.gb-banner-media img{
    filter:
        brightness(.92)
        contrast(1.06)
        saturate(1.02)!important;
}

.gb-banner-slide.is-active .gb-banner-media img{
    filter:
        brightness(.96)
        contrast(1.07)
        saturate(1.06)!important;
}

/* evita fundo preto prolongado se uma mídia falhar */
.gb-banner-slide:not(.is-media-ready) .gb-banner-backdrop{
    opacity:.72!important;
}

/* Transição curta para não existir lacuna visual */
.gb-banner-slide{
    transition:
        opacity .55s ease,
        visibility .55s ease,
        transform .9s ease!important;
}



/* ============================================================
   V23.5 — fallback de imagem por slide
   ============================================================ */
.gb-banner-slide{
    background-color:#080d10!important;
    background-image:var(--gb-banner-image)!important;
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
}

.gb-banner-slide.has-copy .gb-banner-content{
    opacity:1!important;
    visibility:visible!important;
}

.gb-banner-slide.has-copy .gb-banner-copy{
    opacity:1!important;
    visibility:visible!important;
}