@import url('bootstrap.min.css');
@import url('animate.min.css');
@import url('font-awesome.min.css');
@import url('stroke-gap-icons.css');
@import url('bootstrap.offcanvas.css');
@import url('../js/slider/owl.carousel.min.css');
@import url('../js/slider/owl.theme.default.min.css');
@import url('style.css');


/* ==========================================================================
   Estilização do Banner Vendas360 - Gemini DevMaster Pattern
   ========================================================================== */

/* Espaçamento interno e superior/inferior da seção pai */
.header-banner-section {
    padding: 30px 15px; /* Evita que o container cole no topo/rodapé da tela */
    background-color: transparent; /* Mantenha transparente ou ajuste conforme o tema */
}

/* Wrapper da imagem com cantos arredondados, margens e sombra suave */
.vendas360-banner-wrapper {
    position: relative;
    margin: 0 auto;
    padding: 10px; /* Recuo interno para afastar a imagem das bordas do container caso haja fundo */
    max-width: 100%;
    border-radius: 16px; /* Cantos arredondados no container */
    overflow: hidden; /* Garante que o conteúdo não ultrapasse o border-radius */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12); /* Sombra elegante para dar profundidade */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Animação suave ao passar o mouse (Hover UX) */
.vendas360-banner-wrapper:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);
}

/* Ajustes finos na imagem */
.vendas360-banner-img {
    width: 100%;
    height: auto;
    border-radius: 12px; /* Garante o arredondamento perfeito na própria imagem */
    display: block;
    object-fit: cover;
}

/* Ajustes específicos para telas menores (Mobile Responsiveness) */
@media (max-width: 768px) {
    .header-banner-section {
        padding: 15px 10px; /* Espaçamento menor em dispositivos móveis */
    }
    
    .vendas360-banner-wrapper {
        border-radius: 10px;
        padding: 5px;
    }

    .vendas360-banner-img {
        border-radius: 8px;
    }
}