/*=========================================================
    QUEIROZ RADIADORES
    STYLE.CSS
    Versão 1.0
=========================================================*/

/*=========================================================
                        RESET
=========================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Poppins',sans-serif;

    background:#050505;

    color:#ffffff;

    overflow-x:hidden;

    line-height:1.6;

}

img{

    display:block;

    max-width:100%;

}

a{

    text-decoration:none;

    color:inherit;

}

ul{

    list-style:none;

}

button{

    border:none;

    outline:none;

    cursor:pointer;

    font-family:inherit;

}

input,
textarea{

    outline:none;

    font-family:inherit;

}

/*=========================================================
                    VARIÁVEIS
=========================================================*/

:root{

    --cor-principal:#E35336;

    --cor-principal-hover:#ff6d52;

    --preto:#050505;

    --grafite:#101010;

    --grafite2:#181818;

    --cinza:#8f8f8f;

    --cinza-claro:#d7d7d7;

    --branco:#ffffff;

    --container:1280px;

    --transition:.35s;

    --radius:18px;

    --shadow:0 20px 45px rgba(0,0,0,.35);

}

/*=========================================================
                    CONTAINER
=========================================================*/

.container{

    width:92%;

    max-width:var(--container);

    margin:auto;

}

/*=========================================================
                    ESPAÇAMENTO
=========================================================*/

section{

    padding:110px 0;

    position:relative;

}

section:nth-child(even){

    background:#0b0b0b;

}

/*=========================================================
                    TÍTULOS
=========================================================*/

.section-title{

    text-align:center;

    margin-bottom:70px;

}

.section-title span{

    display:inline-block;

    color:var(--cor-principal);

    text-transform:uppercase;

    letter-spacing:3px;

    font-size:14px;

    font-weight:700;

    margin-bottom:18px;

}

.section-title h2{

    font-size:48px;

    font-weight:800;

    margin-bottom:18px;

}

.section-title p{

    max-width:760px;

    margin:auto;

    color:var(--cinza-claro);

    font-size:18px;

    line-height:1.8;

}

/*=========================================================
                    BOTÕES
=========================================================*/

.btn-primary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 38px;

    background:var(--cor-principal);

    color:#fff;

    border-radius:50px;

    font-weight:700;

    transition:var(--transition);

}

.btn-primary:hover{

    background:var(--cor-principal-hover);

    transform:translateY(-4px);

}

.btn-secondary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 38px;

    border:2px solid var(--cor-principal);

    border-radius:50px;

    color:#ffffff;

    font-weight:700;

    transition:var(--transition);

}

.btn-secondary:hover{

    background:var(--cor-principal);

}

/*=========================================================
                    UTILITÁRIOS
=========================================================*/

.text-center{

    text-align:center;

}

.mt-30{

    margin-top:30px;

}

.mt-50{

    margin-top:50px;

}

.mb-30{

    margin-bottom:30px;

}

.mb-50{

    margin-bottom:50px;

}

.radius{

    border-radius:var(--radius);

}

.shadow{

    box-shadow:var(--shadow);

}

/*=========================================================
                        HEADER
=========================================================*/

.header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:9999;

    transition:all .35s ease;

    background:rgba(0,0,0,.18);

    backdrop-filter:blur(10px);

}

.header.scrolled{

    background:rgba(5,5,5,.96);

    border-bottom:1px solid rgba(255,255,255,.08);

    box-shadow:0 10px 30px rgba(0,0,0,.35);

}

.header .container{

    display:flex;

    align-items:center;

    justify-content:space-between;

    height:95px;

}

/*=========================================================
                        LOGO
=========================================================*/

.logo{

    display:flex;

    align-items:center;

    gap:15px;

}

.logo img{

    width:90px;

    transition:.3s;

}

.logo:hover img{

    transform:scale(1.05);

}

.logo-info{

    display:flex;

    flex-direction:column;

}

.logo-info h1{

    font-size:30px;

    font-weight:800;

    color:#ffffff;

    line-height:1;

    letter-spacing:1px;

}

.logo-info span{

    color:var(--cor-principal);

    font-size:18px;

    font-weight:600;

    letter-spacing:2px;

    margin-top:4px;

}

/*=========================================================
                        MENU
=========================================================*/

.menu ul{

    display:flex;

    align-items:center;

    gap:40px;

}

.menu ul li{

    position:relative;

}

.menu ul li a{

    color:#ffffff;

    font-weight:600;

    transition:.3s;

    position:relative;

}

.menu ul li a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:var(--cor-principal);

    transition:.3s;

}

.menu ul li a:hover{

    color:var(--cor-principal);

}

.menu ul li a:hover::after{

    width:100%;

}

/*=========================================================
                BOTÃO HEADER
=========================================================*/

.btn-header{

    display:flex;

    align-items:center;

    justify-content:center;

    padding:15px 28px;

    border-radius:50px;

    background:var(--cor-principal);

    color:#ffffff;

    font-weight:700;

    transition:.3s;

}

.btn-header:hover{

    background:var(--cor-principal-hover);

    transform:translateY(-3px);

}

/*=========================================================
                MENU MOBILE
=========================================================*/

.menu-mobile{

    display:none;

    width:45px;

    height:45px;

    background:none;

    cursor:pointer;

}

.menu-mobile span{

    display:block;

    width:30px;

    height:3px;

    margin:6px auto;

    border-radius:10px;

    background:#ffffff;

    transition:.3s;

}

/*=========================================================
                ESPAÇAMENTO DO TOPO
=========================================================*/

main{

    margin-top:95px;

}

/*=========================================================
                    HERO
=========================================================*/

.hero{

    position:relative;

    width:100%;

    height:100vh;

    min-height:700px;

    overflow:hidden;

    display:flex;

    align-items:center;

    background:#000;

}

/*=========================================================
                SLIDER
=========================================================*/

.hero-slider{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    z-index:1;

}

.slide{

    position:absolute;

    width:100%;

    height:100%;

    opacity:0;

    transition:opacity 1.5s ease-in-out;

}

.slide.active{

    opacity:1;

}

.slide img{

    width:100%;

    height:100%;

    object-fit:cover;

    animation:zoomBanner 12s linear infinite;

}

@keyframes zoomBanner{

    from{

        transform:scale(1);

    }

    to{

        transform:scale(1.10);

    }

}

/*=========================================================
                CAMADA ESCURA
=========================================================*/

.hero-overlay{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    background:linear-gradient(
        90deg,
        rgba(0,0,0,.88) 10%,
        rgba(0,0,0,.60) 55%,
        rgba(0,0,0,.30) 100%
    );

    z-index:2;

}

/*=========================================================
                CONTEÚDO
=========================================================*/

.hero-content{

    position:relative;

    z-index:5;

    max-width:720px;

}

.hero-tag{

    display:inline-block;

    background:rgba(227,83,54,.15);

    border:1px solid rgba(227,83,54,.45);

    color:#ffffff;

    padding:10px 22px;

    border-radius:50px;

    font-size:14px;

    font-weight:600;

    letter-spacing:2px;

    margin-bottom:25px;

}

.hero-content h2{

    font-size:68px;

    line-height:1.1;

    font-weight:800;

    margin-bottom:25px;

}

.hero-content h2 span{

    color:var(--cor-principal);

}

.hero-content p{

    color:#dddddd;

    font-size:20px;

    line-height:1.8;

    margin-bottom:45px;

    max-width:650px;

}

.hero-buttons{

    display:flex;

    gap:20px;

    flex-wrap:wrap;

}

/*=========================================================
                INDICADOR
=========================================================*/

.scroll-down{

    position:absolute;

    left:50%;

    bottom:35px;

    transform:translateX(-50%);

    z-index:20;

}

.scroll-down span{

    display:block;

    width:28px;

    height:48px;

    border:2px solid #ffffff;

    border-radius:30px;

    position:relative;

}

.scroll-down span::before{

    content:"";

    position:absolute;

    left:50%;

    top:8px;

    width:6px;

    height:6px;

    border-radius:50%;

    background:#ffffff;

    transform:translateX(-50%);

    animation:scrollMouse 2s infinite;

}

@keyframes scrollMouse{

    0%{

        opacity:0;

        top:8px;

    }

    50%{

        opacity:1;

    }

    100%{

        opacity:0;

        top:28px;

    }

}

/*=========================================================
                ANIMAÇÃO TEXTO
=========================================================*/

.hero-tag,
.hero-content h2,
.hero-content p,
.hero-buttons{

    animation:fadeHero 1.2s ease forwards;

}

@keyframes fadeHero{

    from{

        opacity:0;

        transform:translateY(35px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================================
                    EMPRESA
=========================================================*/

.empresa{

    background:#0b0b0b;

}

.empresa-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.empresa-imagem{

    position:relative;

}

.empresa-imagem img{

    width:100%;

    border-radius:20px;

    box-shadow:var(--shadow);

}

.empresa-conteudo h2{

    font-size:46px;

    font-weight:800;

    margin-bottom:25px;

}

.empresa-conteudo h2 span{

    color:var(--cor-principal);

}

.empresa-conteudo p{

    color:var(--cinza-claro);

    font-size:18px;

    line-height:1.9;

    margin-bottom:25px;

}

/*=========================================================
                LISTA DE DIFERENCIAIS
=========================================================*/

.lista-diferenciais{

    margin-top:35px;

}

.lista-diferenciais li{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:18px;

    font-size:17px;

    color:#ffffff;

}

.lista-diferenciais li i{

    width:34px;

    height:34px;

    border-radius:50%;

    background:var(--cor-principal);

    display:flex;

    align-items:center;

    justify-content:center;

    font-style:normal;

    font-weight:700;

}

/*=========================================================
                    DIFERENCIAIS
=========================================================*/

.diferenciais{

    margin-top:90px;

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:30px;

}

.diferencial{

    background:var(--grafite);

    padding:40px 30px;

    border-radius:20px;

    text-align:center;

    transition:var(--transition);

    border:1px solid rgba(255,255,255,.05);

}

.diferencial:hover{

    transform:translateY(-10px);

    border-color:rgba(227,83,54,.35);

    box-shadow:0 25px 45px rgba(0,0,0,.35);

}

.diferencial img{

    width:70px;

    margin:0 auto 25px;

}

.diferencial h3{

    font-size:24px;

    margin-bottom:18px;

}

.diferencial p{

    color:var(--cinza-claro);

    line-height:1.8;

}

/*=========================================================
                    CONTADORES
=========================================================*/

.contadores{

    margin-top:90px;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.contador{

    background:linear-gradient(180deg,#141414,#0c0c0c);

    border-radius:18px;

    text-align:center;

    padding:45px 20px;

    border:1px solid rgba(255,255,255,.05);

    transition:var(--transition);

}

.contador:hover{

    transform:translateY(-8px);

    border-color:rgba(227,83,54,.35);

}

.contador h3{

    font-size:52px;

    color:var(--cor-principal);

    margin-bottom:12px;

    font-weight:800;

}

.contador span{

    display:block;

    font-size:18px;

    color:#ffffff;

    font-weight:600;

}

/*=========================================================
                DIVISOR
=========================================================*/

.linha{

    width:90px;

    height:4px;

    background:var(--cor-principal);

    margin:25px 0;

    border-radius:30px;

}

/*=========================================================
                    SERVIÇOS
=========================================================*/

.servicos{

    background:#050505;

}

.servicos-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(350px,1fr));

    gap:35px;

}

/*=========================================================
                    CARD SERVIÇO
=========================================================*/

.servico{

    position:relative;

    overflow:hidden;

    border-radius:20px;

    background:#111111;

    transition:.4s;

    box-shadow:0 15px 35px rgba(0,0,0,.30);

}

.servico:hover{

    transform:translateY(-10px);

    box-shadow:0 25px 45px rgba(0,0,0,.45);

}

.servico img{

    width:100%;

    height:280px;

    object-fit:cover;

    transition:.6s;

}

.servico:hover img{

    transform:scale(1.08);

}

/*=========================================================
                    CONTEÚDO
=========================================================*/

.servico-content{

    padding:30px;

}

.servico-content h3{

    font-size:28px;

    margin-bottom:15px;

    color:#ffffff;

    font-weight:700;

}

.servico-content p{

    color:#d4d4d4;

    line-height:1.8;

    margin-bottom:25px;

}

/*=========================================================
                    BOTÃO
=========================================================*/

.servico-content a{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:var(--cor-principal);

    font-weight:700;

    transition:.3s;

}

.servico-content a:hover{

    gap:18px;

}

/*=========================================================
                ETIQUETA
=========================================================*/

.servico-badge{

    position:absolute;

    top:20px;

    left:20px;

    background:var(--cor-principal);

    color:#ffffff;

    padding:8px 18px;

    border-radius:30px;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

}

/*=========================================================
                SOBREPOSIÇÃO
=========================================================*/

.servico::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(

        transparent,

        rgba(0,0,0,.15)

    );

    opacity:0;

    transition:.4s;

}

.servico:hover::before{

    opacity:1;

}

/*=========================================================
                ANIMAÇÃO
=========================================================*/

.servico{

    animation:fadeCard .8s ease;

}

@keyframes fadeCard{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================================
            BOTÃO CENTRAL
=========================================================*/

.servicos-footer{

    margin-top:70px;

    text-align:center;

}

/*=========================================================
                ITEM DA GALERIA
=========================================================*/

.galeria-item{

    position:relative;

    overflow:hidden;

    border-radius:20px;

    cursor:pointer;

    background:#111111;

    box-shadow:0 15px 35px rgba(0,0,0,.35);

}

.galeria-item img{

    width:100%;

    height:300px;

    object-fit:cover;

    transition:.6s;

}

.galeria-item:hover img{

    transform:scale(1.10);

}

/*=========================================================
                SOBREPOSIÇÃO
=========================================================*/

.galeria-item::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(

        transparent,

        rgba(0,0,0,.70)

    );

    opacity:0;

    transition:.4s;

    z-index:1;

}

.galeria-item:hover::before{

    opacity:1;

}

/*=========================================================
                TEXTO
=========================================================*/

.galeria-info{

    position:absolute;

    left:30px;

    bottom:25px;

    z-index:2;

    opacity:0;

    transform:translateY(25px);

    transition:.4s;

}

.galeria-item:hover .galeria-info{

    opacity:1;

    transform:translateY(0);

}

.galeria-info h3{

    color:#ffffff;

    font-size:24px;

    margin-bottom:8px;

}

.galeria-info span{

    color:#ffffff;

    font-size:15px;

    opacity:.9;

}

/*=========================================================
                ÍCONE
=========================================================*/

.galeria-zoom{

    position:absolute;

    top:20px;

    right:20px;

    width:52px;

    height:52px;

    border-radius:50%;

    background:rgba(227,83,54,.95);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    font-size:22px;

    opacity:0;

    transform:scale(.8);

    transition:.35s;

    z-index:2;

}

.galeria-item:hover .galeria-zoom{

    opacity:1;

    transform:scale(1);

}

/*=========================================================
                BOTÃO FECHAR
=========================================================*/

.lightbox-close{

    position:absolute;

    top:30px;

    right:40px;

    font-size:45px;

    color:#ffffff;

    cursor:pointer;

}

/*=========================================================
                ANIMAÇÃO
=========================================================*/

.galeria-item{

    animation:fadeGaleria .8s ease;

}

@keyframes fadeGaleria{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================================
                    CONTATO
=========================================================*/

.contato{

    background:#050505;

}

.contato-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:start;

}

/*=========================================================
                INFORMAÇÕES
=========================================================*/

.contato-info h2{

    font-size:44px;

    margin-bottom:25px;

    font-weight:800;

}

.contato-info p{

    color:var(--cinza-claro);

    line-height:1.9;

    margin-bottom:20px;

}

.contato-lista{

    margin-top:35px;

}

.contato-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    margin-bottom:30px;

}

.contato-icone{

    width:60px;

    height:60px;

    background:var(--cor-principal);

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    color:#ffffff;

    flex-shrink:0;

}

.contato-texto h3{

    font-size:20px;

    margin-bottom:8px;

}

.contato-texto p,
.contato-texto a{

    color:var(--cinza-claro);

    transition:var(--transition);

}

.contato-texto a:hover{

    color:var(--cor-principal);

}

/*=========================================================
                MAPA
=========================================================*/

.mapa{

    overflow:hidden;

    border-radius:20px;

    box-shadow:var(--shadow);

}

.mapa iframe{

    width:100%;

    height:500px;

    border:0;

}

/*=========================================================
                FORMULÁRIO
=========================================================*/

.formulario{

    margin-top:40px;

}

.form-group{

    margin-bottom:20px;

}

.form-group input,
.form-group textarea{

    width:100%;

    padding:18px 20px;

    background:#111111;

    border:1px solid rgba(255,255,255,.08);

    border-radius:12px;

    color:#ffffff;

    font-size:16px;

    transition:var(--transition);

}

.form-group textarea{

    min-height:180px;

    resize:vertical;

}

.form-group input:focus,
.form-group textarea:focus{

    border-color:var(--cor-principal);

}

.form-group input::placeholder,
.form-group textarea::placeholder{

    color:#9d9d9d;

}

/*=========================================================
                BOTÃO FORMULÁRIO
=========================================================*/

.formulario button{

    width:100%;

    padding:18px;

    border-radius:50px;

    background:var(--cor-principal);

    color:#ffffff;

    font-size:17px;

    font-weight:700;

    transition:var(--transition);

}

.formulario button:hover{

    background:var(--cor-principal-hover);

    transform:translateY(-3px);

}

/*=========================================================
                REDES SOCIAIS
=========================================================*/

.redes-sociais{

    display:flex;

    gap:15px;

    margin-top:35px;

}

.redes-sociais a{

    width:50px;

    height:50px;

    border-radius:50%;

    background:#111111;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    transition:var(--transition);

}

.redes-sociais a:hover{

    background:var(--cor-principal);

    transform:translateY(-5px);

}

/*=========================================================
                    RODAPÉ
=========================================================*/

.footer{

    background:#030303;

    border-top:1px solid rgba(255,255,255,.08);

    padding:80px 0 30px;

}

.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:50px;

}

.footer-logo img{

    width:100px;

    margin-bottom:20px;

}

.footer h3{

    font-size:22px;

    margin-bottom:20px;

    color:#ffffff;

}

.footer p{

    color:var(--cinza-claro);

    line-height:1.9;

}

.footer ul li{

    margin-bottom:12px;

}

.footer ul li a{

    color:var(--cinza-claro);

    transition:var(--transition);

}

.footer ul li a:hover{

    color:var(--cor-principal);

    padding-left:8px;

}

.footer-bottom{

    margin-top:60px;

    padding-top:25px;

    border-top:1px solid rgba(255,255,255,.08);

    text-align:center;

    color:#9a9a9a;

    font-size:15px;

}

/*=========================================================
                BOTÃO WHATSAPP
=========================================================*/

.whatsapp-float{

    position:fixed;

    right:25px;

    bottom:25px;

    width:65px;

    height:65px;

    border-radius:50%;

    background:#25D366;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    font-size:30px;

    text-decoration:none;

    box-shadow:0 10px 30px rgba(0,0,0,.35);

    z-index:9999;

    transition:var(--transition);

}

.whatsapp-float:hover{

    transform:scale(1.1);

}

/*=========================================================
                VOLTAR AO TOPO
=========================================================*/

.back-top{

    position:fixed;

    right:25px;

    bottom:105px;

    width:50px;

    height:50px;

    border-radius:50%;

    background:var(--cor-principal);

    color:#ffffff;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    opacity:0;

    visibility:hidden;

    transition:var(--transition);

    z-index:9998;

}

.back-top.show{

    opacity:1;

    visibility:visible;

}

.back-top:hover{

    background:var(--cor-principal-hover);

}

/*=========================================================
                ANIMAÇÕES
=========================================================*/

.fade-up{

    opacity:0;

    transform:translateY(40px);

    transition:1s;

}

.fade-up.show{

    opacity:1;

    transform:translateY(0);

}

/*=========================================================
                SCROLLBAR
=========================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:#111111;

}

::-webkit-scrollbar-thumb{

    background:var(--cor-principal);

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--cor-principal-hover);

}

/*=========================================================
                SELEÇÃO DE TEXTO
=========================================================*/

::selection{

    background:var(--cor-principal);

    color:#ffffff;

}

/*=========================================================
                    VÍDEO
=========================================================*/

.video-section{

    padding:120px 0;

    background:#050505;

}

.video-background{

    position:relative;

    overflow:hidden;

    border-radius:25px;

    height:650px;

}

.video-background img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.8s;

}

.video-background:hover img{

    transform:scale(1.05);

}
.video-overlay{

    position:absolute;

    left:0;
    right:0;
    bottom:0;
    top:auto;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.90) 0%,
        rgba(0,0,0,.60) 35%,
        rgba(0,0,0,0) 100%
    );

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:flex-end;

    padding:40px;

    padding-bottom:50px;

    text-align:center;

}
.play-video{

    margin-top:40px;

    width:95px;

    height:95px;

    border-radius:50%;

    border:none;

    background:#ff6b00;

    color:#fff;

    font-size:36px;

    cursor:pointer;

    transition:.4s;

}

.play-video:hover{

    transform:scale(1.12);

}

.video-modal{

    position:fixed;

    top:0;
    left:0;
    width:100%;
    height:100%;

    background:rgba(0,0,0,.92);

    display:flex;

    justify-content:center;

    align-items:center;

    opacity:0;

    visibility:hidden;

    pointer-events:none;

    transition:.3s;

    z-index:999999;

}

.video-modal.active{

    opacity:1;

    visibility:visible;

    pointer-events:auto;

}

.video-box{

    position:relative;

    width:95%;

    max-width:1000px;

    aspect-ratio:16/9;

}

.video-box iframe{

    width:100%;

    height:100%;

    border:none;

    border-radius:15px;

}

#videoContainer{

    width:100%;

    height:100%;

}

#videoContainer iframe{

    width:100%;

    height:100%;

    border:none;

    border-radius:15px;

}

.fechar-video{

    position:absolute;

    top:-55px;

    right:0;

    color:#fff;

    font-size:45px;

    cursor:pointer;

}

.video-info{

    background:#111;

    padding:35px;

    text-align:center;

    border-radius:0 0 25px 25px;

}

.video-info span{

    color:#ff6b00;

    font-weight:700;

    letter-spacing:2px;

}

.video-info h2{

    color:#fff;

    font-size:34px;

    margin:15px 0;

}

.video-info p{

    color:#ccc;

    max-width:800px;

    margin:auto;

    line-height:1.7;

}

/*==================================================
            FAIXA SUPERIOR HERO
==================================================*/

.hero-top-info{

    width:95%;

    max-width:1400px;

    margin:0 auto 35px;

    padding:18px 40px;

    background:#e35336;

    border-radius:50px;

    color:#fff;

    font-size:17px;

    font-weight:700;

    letter-spacing:1px;

    text-align:center;

    line-height:1.6;

    box-shadow:0 10px 30px rgba(227,83,54,.35);

    backdrop-filter:blur(10px);

}

/*=========================================================
        NOVA CAPA DA GALERIA
=========================================================*/

.galeria-capa{

    position:relative;

    max-width:1100px;

    margin:auto;

    border-radius:22px;

    overflow:hidden;

    border:2px solid #E35336;

    box-shadow:0 20px 50px rgba(0,0,0,.45);

}

.galeria-capa img{

    width:100%;

    height:650px;

    object-fit:cover;

}

.galeria-capa-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(

        rgba(0,0,0,.25),

        rgba(0,0,0,.75)

    );

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    align-items:center;

    padding:60px;

}

.galeria-capa-overlay h3{

    color:#fff;

    font-size:38px;

    margin-bottom:30px;

    text-align:center;

}

.btn-abrir-galeria{

    background:#E35336;

    color:#fff;

    border:none;

    padding:18px 45px;

    font-size:20px;

    font-weight:700;

    border-radius:50px;

    cursor:pointer;

    transition:.3s;

}

.btn-abrir-galeria:hover{

    transform:scale(1.05);

    background:#ff6d52;

}

.galeria-escondida{

    display:none;

}

/*=========================================================
        BOTÃO FLUTUANTE FECHAR GALERIA
=========================================================*/

.fechar-galeria-btn{

    position:fixed;

    right:25px;

    bottom:105px;

    z-index:99999;

    display:none;

    background:#E35336;

    color:#fff;

    padding:16px 28px;

    border:none;

    border-radius:50px;

    font-size:16px;

    font-weight:700;

    cursor:pointer;

    box-shadow:0 10px 30px rgba(0,0,0,.35);

    transition:.3s;

}

.fechar-galeria-btn.ativo{

    display:block;

}

.fechar-galeria-btn:hover{

    background:#ff6d52;

    transform:translateY(-3px);

}

@media (max-width:768px){

    .fechar-galeria-btn{

        right:15px;

        bottom:90px;

        font-size:14px;

        padding:14px 20px;

    }

}

/*================ GALERIA NOVA ================*/

.galeria-capa{

position:relative;

overflow:hidden;

border-radius:20px;

}

.galeria-capa img{

width:100%;

height:650px;

object-fit:cover;

}

.galeria-capa-overlay{

position:absolute;

inset:0;

background:rgba(0,0,0,.45);

display:flex;

flex-direction:column;

justify-content:flex-end;

align-items:center;

padding:60px;

}

.galeria-capa-overlay h3{

font-size:40px;

margin-bottom:30px;

color:#fff;

}

.btn-galeria{

background:#E35336;

color:#fff;

padding:18px 45px;

border-radius:50px;

font-size:20px;

font-weight:700;

}

.galeria-lista{

display:none;

margin-top:40px;

grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

gap:20px;

}

.galeria-lista.ativa{

display:grid;

}

.foto{

overflow:hidden;

border-radius:15px;

}

.foto img{

width:100%;

display:block;

transition:.4s;

}

.foto img:hover{

transform:scale(1.05);

}

#fecharGaleria{

display:none;

position:fixed;

right:25px;

bottom:100px;

z-index:99999;

background:#E35336;

color:#fff;

padding:18px 28px;

border-radius:50px;

font-weight:700;

box-shadow:0 10px 30px rgba(0,0,0,.4);

}

#fecharGaleria.ativo{

display:block;

}

/*=========================================
        LIGHTBOX NOVA GALERIA
=========================================*/

.lightbox-novo{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.95);

    display:none;

    justify-content:center;

    align-items:center;

    z-index:999999;

    padding:30px;

}

.lightbox-novo.ativo{

    display:flex;

}

.lightbox-novo img{

    max-width:95%;

    max-height:92vh;

    border-radius:15px;

    box-shadow:0 20px 60px rgba(0,0,0,.6);

}

#fecharLightbox{

    position:absolute;

    top:20px;

    right:30px;

    color:#fff;

    font-size:55px;

    cursor:pointer;

    font-weight:bold;

}
