@charset "UTF-8";

/* Variáveis */
:root {
	--cor1: #323543;
	--cor2: #3f4355;
    --cor3: #292c39;
    --cor4: #424967;
    --cor5: #080808;
    --cor6: #1e1e1e;
    --cor7: #f0e60d;
    --cor8: #272a37;
    --cor9: #101010;
    --cor10: #655d30;
    --cor11: #dfcfb7;

    /* --bs-body-bg: var(--cor1); */
}

/* Base */
/* html{ scroll-padding-top: 90px;}
@media (min-width:1024px) {html{ scroll-padding-top: 150px;}} */
body {font-family: 'Montserrat', sans-serif; color: #000; overflow-x: hidden; }
@media (max-width: 1024px){main {width: 100vw; overflow-x: hidden;}}


/* Header */
.header {position: sticky; top: 0; z-index: 1000; margin-bottom: -128px;}
.header:before {content: ""; position: absolute; left: 0; top: 0; right: 0; z-index: -1; bottom: 0;  }

.header--index.scrolled {background: rgba(255, 255, 255, .9);}
.header--internal.scrolled {background: rgba(0, 0, 0, .9);}

.header--index:not(.scrolled) .drop-shadow {filter: drop-shadow(0px 0px 4px rgba(255, 255, 255, 1));}

/* Navegação */
@media (max-width: 500px) {.navbar-brand svg {height: 58px; width: 180px;}}
.navbar-nav {--bs-nav-link-padding-y: 0rem;}
.header .nav-link {font-weight: 500; color: #000;}
.nav-link:focus, 
.nav-link:hover,
.navbar-nav .nav-link.active, 
.navbar-nav .nav-link.show,
.nav-item:hover .nav-link {color: #000;}

.navbar-nav .dropdown-menu {background: var(--cor1);}
.navbar-nav .dropdown-item {color: #fff;}
.navbar-nav .dropdown-item:hover {background: var(--cor4); color: #fff;}

/* @media (min-width: 1200px) {
    .header .nav-link {font-size: 1rem;  position: relative; margin: 0 3px;}

    .navbar-nav .nav-item:hover .dropdown-menu {display: block;} 
    .navbar-nav .nav-link.active:before,
    .header .nav-link:hover:before {content: ""; position: absolute; background: var(--cor7); height: 2px; left: 8px; right: 8px; bottom: -5px;}

} */

/* @media (max-width: 1199px) { */
    .header .nav-link,
    .navbar-nav .dropdown-item {padding: 6px 0; border-bottom: 1px solid #d3d3d3;}
    .navbar-nav .dropdown-menu {border: 0;}
    .navbar-nav .nav-link {font-size: 1.1rem}
/* } */

/* Theme */
@media (min-width: 1400px) {.container, .container-lg, .container-md, .container-sm, .container-xl {max-width: 1400px;}}
@media (max-width: 768px) {.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {--bs-gutter-x: 3.5rem;}}
.btn-primary {--bs-btn-bg: var(--cor1); --bs-btn-border-color: var(--cor1); --bs-btn-hover-bg: var(--cor3); --bs-btn-hover-border-color: var(--cor3);}
.btn-outline-primary { --bs-btn-color: var(--cor1); --bs-btn-border-color: var(--cor1); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cor1); --bs-btn-hover-border-color: var(--cor1);}
.btn-secondary {--bs-btn-bg: var(--cor2); --bs-btn-border-color: var(--cor2); --bs-btn-hover-bg: var(--cor9); --bs-btn-hover-border-color: var(--cor9);}
.btn-outline-secondary {--bs-btn-color: var(--cor2); --bs-btn-border-color: var(--cor2); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cor2); --bs-btn-hover-border-color: var(--cor2);}
.btn-outline-success {--bs-btn-color: var(--cor6); --bs-btn-border-color: var(--cor6); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cor6); --bs-btn-hover-border-color: var(--cor6);}

.border-success {border-color: var(--cor6) !important;}
/*.form-control,*/ 
.form-check .form-check-input {--bs-border-color: #868789;}
.fs-7 {font-size: 4.5rem;}
@media (max-width: 1024px) {.btn {font-weight: 500;}}
@media (min-width: 1200px) {.position-xl-absolute {position: absolute;}}
.form-control {--bs-border-color: var(--cor1);}
.page-link {color: var(--cor1); background-color: #fff;  border-color: var(--cor1); }
.page-link:hover {color: #fff; background-color: var(--cor1); border-color: var(--cor1);}
.active>.page-link, .page-link.active {z-index: 3;color: #fff; background-color: var(--cor1); border-color: var(--cor1);}

.page-item:first-child .page-link,
.page-item:last-child .page-link {border-radius: 0;}


@media (min-width: 1200px) {.vw-56 {width: 56vw;}}
.text-shadow {text-shadow: 0 0 4px black;}

/* Animações */
.zoom-container {overflow: hidden;}
.zoom-image {object-fit: cover; width: 100%; height: 100%; transition: transform 0.4s ease;}
.zoom-container:hover .zoom-image {transform: scale(1.1);}

.zoom-button,
.zoom-shadow-button {cursor: pointer;transition: transform 0.2s ease;}
.zoom-button:hover {transform: scale(1.1);}
.zoom-shadow-button:hover {transform: scale(1.1);box-shadow: 0 8px 16px rgba(0,0,0,0.2);}

/* Swiper */
.swiper-button-prev:after {content: "" !important;}
.swiper-button-next:after {content: "" !important;}
.swiper-button-next, .swiper-button-prev {width: 44px !important;}
.swiper1 .swiper-button-prev1 {left: 10%;}
.swiper1 .swiper-button-next1 {right: 10%;}
@media (max-width: 1024px) {
    .swiper1 .swiper-button-prev1,
    .swiper1 .swiper-button-next1 {bottom: 20px; top: auto;}
}

/* Footer */
.footer {background: var(--cor5);}
.footer__copy {background: var(--cor9);}

/* Botão Flutuante */
#whatsapp-float {position: fixed; bottom: 20px; right: 20px; background-color: #25d366; border-radius: 50%; cursor: pointer; z-index: 999; display: flex; align-items: center; justify-content: center;  height: 70px;  width: 70px;}
.notification-badge {position: absolute; top: 5px; right: 5px; background-color: red; color: white; font-size: 12px; border-radius: 50%; height: 16px; width: 16px; display: flex; align-items: center; justify-content: center;}

/* Janela de Chat */
#whatsapp-chat {position: fixed; bottom: 80px; right: 20px; width: 320px; background: white; border: 1px solid #fff; border-radius: 8px; display: none; flex-direction: column; z-index: 1000; box-shadow: 0 0 10px rgba(0,0,0,0.2); overflow: hidden;}
.chat-header {background: #00a884; color: white; padding: 10px; font-weight: bold; border-radius: 8px 8px 0 0;}
.chat-body {padding: 10px; background: #f0ebe3;}
.chat-body p {border-radius: 0 5px 5px 5px;}
#chat-message {width: 100%; height: 60px; margin-top: 10px; margin-bottom: 5px;}

/* Area de atuação home */
.bg-area-atuacao {height: 20%;}
@media (min-width: 992px) {.bg-area-atuacao {height: 50%;}}

/* Solucoes praticas home */
.bg-solucoes {width: 100%; height: 100%;}
@media (min-width: 992px) {.bg-solucoes {width: 55%; height: 62%;}}

/* Notícias */
.page-noticias-detalhe main img {max-width: 100%;}

/* Topos */
.topo {height: 280px; position: relative; overflow: hidden;}
.topo:before {background: linear-gradient(to bottom, rgba(0,0,0,.6), transparent); content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.topo--1 {background: url(../img/topo1.webp) no-repeat 50% 0 / cover;}
.topo--2 {background: url(../img/topo2.webp) no-repeat 50% 0 / cover;}
.topo--3 {background: url(../img/topo3.webp) no-repeat 50% 0 / cover;}
.topo--4 {background: url(../img/topo4.webp) no-repeat 50% 0 / cover;}
.topo--5 {background: url(../img/topo5.webp) no-repeat 50% 0 / cover;}
.topo--6 {background: url(../img/topo6.webp) no-repeat 50% 0 / cover;}
.topo--7 {background: url(../img/topo7.webp) no-repeat 50% 0 / cover;}
.topo--8 {background: url(../img/topo8.webp) no-repeat 50% 0 / cover;}
.topo--9 {background: url(../img/topo9.webp) no-repeat 50% 0 / cover;}
@media (min-width: 992px) {.topo {height: 368px;}}
@media (min-width: 1200px) {.topo {height: 468px;}}

/* Utilitários */
.bg1 {background: var(--cor1);}
.bg2 {background: var(--cor2);}
.bg3 {background: var(--cor3);}
.bg4 {background: var(--cor4);}
.bg5 {background: var(--cor5);}
.bg6 {background: var(--cor6);}
.bg7 {background: var(--cor7);}
.bg8 {background: var(--cor8);}
.bg10 {background: var(--cor10);}
.bg11 {background: var(--cor11);}

.cor1 {color: var(--cor1);}
.cor2 {color: var(--cor2);}
.cor3 {color: var(--cor3);}
.cor4 {color: var(--cor4);}
.cor5 {color: var(--cor5);}
.cor6 {color: var(--cor6);}
.cor8 {color: var(--cor8);}
.cor10 {color: var(--cor10);}

.fill10 {fill: var(--cor10)}

.shadow-1 {box-shadow: 5px 10px 15px rgba(0, 0, 0, .4);}
.filter-inverted {filter: brightness(0) invert(1);}
.cursor-default {cursor: default;}
.gradient-6to1-bl {background: linear-gradient(to bottom left, var(--cor6), var(--cor1));}
.grayscale {filter: grayscale(100%);}
.grayscale-hover {filter: grayscale(100%); transition: filter 0.3s ease;}
.grayscale-hover:hover {filter: grayscale(0%);}
