
@import url('https://fonts.googleapis.com/css?family=Lato:300,400|Poppins:300,400,500,600,700');

/* --- 1. BASE E RESET DE ALTO CONTRASTE --- */
html, body {
    height: 100%; 
    background-color: #000000 !important; 
    color: #f3f4f6; 
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
}
.floatleft {float:left}
.floatright {float:right}
.alignleft {float:left;margin-right:15px;margin-bottom: 15px}
.alignright {float:right;margin-left:15px;margin-bottom: 15px}
.aligncenter {display:block;margin:0 auto 15px}
a:focus {outline:0px solid}
img {max-width:100%;height:auto}
.fix {overflow:hidden}
p {margin:0 0 15px;font-size:14px;font-weight:300; line-height: 1.8; color: #a3a3a3;}
h1, h2, h3, h4, h5, h6 {margin:0 0 15px; color: #ffffff; font-family: 'Poppins', sans-serif; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;}
a {transition: all 0.3s ease 0s;text-decoration:none; color: #ffffff;}
a:hover {text-decoration: none; color: #d1d5db;}
ul{list-style: outside none none;margin: 0;padding: 0}
.clear{clear:both}
body {font-family: 'Poppins', sans-serif;font-weight:300;font-size:14px;}
::selection {background: #4b5563; color: #fff;}

/* --- 2. ESPAÇAMENTOS E GRID SISTEMA --- */
.ptb-6{padding:6px 0;} .ptb-80{padding:80px 0;} .ptb-100{padding:100px 0;}
.pt-120{padding-top:120px} .pt-100{padding-top:100px} .pt-200{padding-top:200px}
.pt-50{padding-top:50px} .pt-80{padding-top:50px} .pb-30{padding-bottom:30px}
.pb-60{padding-bottom:60px} .pb-80{padding-bottom:80px} .pb-150{padding-bottom:150px}
.pb-100{padding-bottom:100px} .mb-20{margin-bottom:20px;} .mb-30{margin-bottom:30px;}
.mt-50{margin-top:50px;} .mt-40{margin-top:40px;} .mt-60{margin-top:60px;} .mt-30{margin-top:30px;}

/* --- 3. HEADER E TOPBAR (ESTILO AÇO) --- */
.header-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background-color: #000000;
  border-bottom: 1px solid #1a1a1a;
}
.email, .phone {
	background: #0a0a0a;
	color: #ffffff;
	font-size: 12px;
	padding: 10px 15px;
	display: inline-block;
    border: 1px solid #1a1a1a;
    font-weight: 500;
    

}
.img-representante {
    max-width: 250px;
    height: auto;
    border-radius: 15px !important; /* Arredondado suave e moderno */
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    
}
.social-icon a{color:#ffffff; margin-left: 20px; font-size: 14px; display: inline-block; transition: 0.3s;}
.social-icon a:hover{color: #9ca3af; transform: translateY(-2px);}


.social-icon a{color:#ffffff; margin-left: 20px; font-size: 14px; display: inline-block; transition: 0.3s;}
.social-icon a:hover{color: #9ca3af; transform: translateY(-2px);}

/* --- 4. MENU PRINCIPAL --- */
.main-menu ul li {display: inline-block; position:relative; margin: 0 2px;}
.main-menu ul li a {
  color: #ffffff;
  display: block;
  font-size: 13px;
  font-weight: 600;
  padding: 40px 15px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.main-menu ul li:hover > a{color: #9ca3af;}
.main-menu ul li ul {
  background: #050505;
  border-top: 2px solid #ffffff;
  opacity: 0;
  position: absolute;
  top: 100%;
  width: 230px;
  visibility: hidden;
  transition: 0.3s;
  z-index: 999;
  border-left: 1px solid #1a1a1a;
  border-right: 1px solid #1a1a1a;
  border-bottom: 1px solid #1a1a1a;
}
.main-menu ul li:hover > ul {visibility: visible; opacity: 1;}
.main-menu ul li ul li {display: block; margin: 0;}
.main-menu ul li ul li a {
  padding: 15px 20px;
  border-bottom: 1px solid #111;
  font-size: 12px;
  color: #a3a3a3;
  text-transform: capitalize;
}
.main-menu ul li ul li a:hover {background: #111; color: #ffffff; padding-left: 25px;}

/* --- 5. BUSCA (RESTURADA E ESTILIZADA) --- */
.search-box {
    position: relative;
    display: inline-block;
    margin-left: 20px;
    vertical-align: middle;
}
.search-box input {
    background: #0a0a0a;
    border: 1px solid #1a1a1a;
    color: #ffffff;
    padding: 8px 15px;
    font-size: 13px;
    transition: 0.3s;
    border-radius: 0;
}
.search-box input:focus {
    border-color: #ffffff;
    width: 200px;
}
.search-box button {
    background: transparent;
    border: none;
    color: #ffffff;
    cursor: pointer;
    padding: 5px;
}

/* --- 6. SERVIÇOS E PRODUTOS (CARDS) --- */
.single-service {
  background: #050505;
  border: 1px solid #1a1a1a;
  padding: 50px 30px;
  transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  text-align: center;
  margin-bottom: 30px;
  height: 100%;
}
.single-service:hover {
  border-color: #ffffff;
  transform: translateY(-5px);
  background: #0a0a0a;
  box-shadow: 0 20px 40px rgba(0,0,0,0.5);
}
.service-icon i {color: #ffffff; font-size: 40px; margin-bottom: 25px; display: block;}
.single-service h3 {font-size: 18px; color: #ffffff; margin-bottom: 15px;}
.single-service p {color: #9ca3af; font-size: 14px; margin-bottom: 0;}

/* --- 7. PROJETOS E IMAGENS (HOVER PREMIUM) --- */
.Project-box {position: relative; overflow: hidden; background: #000; margin-bottom: 30px;}
.Project-image a {position: relative; display: block;}
.Project-image a:before {
  background: rgba(0, 0, 0, 0.85);
  position: absolute; content: ""; opacity: 0; left: 15px; right: 15px; top: 15px; bottom: 15px; 
  transform: scale(0.8); transition: 0.4s; border: 1px solid #ffffff; z-index: 1;
}
.Project-box:hover .Project-image a:before {opacity: 1; transform: scale(1);}
.Project-content {
  position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%);
  text-align: center; opacity: 0; transition: 0.4s; visibility: hidden; z-index: 2;
}
.Project-box:hover .Project-content {opacity: 1; visibility: visible;}
.Project-content h4 a {color: #ffffff; font-size: 22px; font-weight: 600;}
.Project-content span {color: #d1d5db; font-size: 14px; text-transform: uppercase;}

/* --- 8. BOTÕES (CONTRASTE) --- */
.btn {
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #000000 !important;
  cursor: pointer;
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-align: center;
  transition: 0.3s;
  text-transform: uppercase;
  padding: 12px 22px;
  margin-top: 25px;
  border-radius: 0;
}
.btn:hover {
  background-color: transparent;
  color: #ffffff !important;
  box-shadow: 0 0 15px rgba(255,255,255,0.2);
}

/* --- 9. FOOTER E WIDGETS --- */
.footer-bg {background: #000000; border-top: 1px solid #1a1a1a; padding: 70px 0 60px;}
.widget-title {color: #ffffff; font-size: 18px; font-weight: 600; text-transform: uppercase; margin-bottom: 35px; position: relative;}
.widget-title::after {content: ""; display: block; width: 30px; height: 2px; background: #ffffff; margin-top: 10px;}
.footer-menu li a {color: #a3a3a3; font-size: 14px; line-height: 2.8; transition: 0.3s;}
.footer-menu li a:hover {color: #ffffff; padding-left: 8px;}
.copyright-area {background: #000; border-top: 1px solid #111; padding: 30px 0;}
.copyright-text p {color: #4b5563; font-size: 13px; letter-spacing: 0.5px;}

/* --- 10. WOOCOMMERCE INTEGRATION (GRID COMPACTO) --- */
.woocommerce ul.products {
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-wrap: wrap;
}

.woocommerce ul.products li.product {
    background: #050505;
    border: 1px solid #1a1a1a;
    padding: 10px !important; /* Espaço interno menor */
    margin: 0 5px 10px 5px !important; /* Espaço entre os cards reduzido */
    transition: 0.3s;
    width: calc(25% - 10px) !important; /* Força 4 colunas no PC com menos espaço */
}

.woocommerce ul.products li.product img {
    margin-bottom: 10px !important;
    width: 100% !important;
    height: auto !important;
    display: block;
}

.woocommerce-loop-product__title {
    text-align: center;
    padding: 5px 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    min-height: 40px; /* Garante que os títulos alinhem mesmo se um for maior */
}

/* Ajuste para Celular - 2 colunas coladinhas */
@media (max-width: 768px) {
    .woocommerce ul.products li.product {
        width: calc(50% - 10px) !important;
        margin: 5px !important;
    }
}

/* --- 11. RESPONSIVIDADE COMPLETA --- */
@media (max-width: 991px) {
    .main-menu ul li a { padding: 30px 10px; font-size: 12px; }
}
@media (max-width: 767px) {
    .header-fixed { position: relative; }
    .ptb-80 { padding: 50px 0; }
    .section-heading h2 { font-size: 26px; }
    .single-service { margin-bottom: 20px; }
}

/* --- 12. FORMULÁRIOS E INPUTS --- */
input[type="text"], input[type="email"], textarea {
    background: #0a0a0a !important;
    border: 1px solid #1a1a1a !important;
    color: #ffffff !important;
    padding: 15px !important;
    width: 100%;
    margin-bottom: 15px;
    transition: 0.3s;
}
input:focus, textarea:focus { border-color: #ffffff !important; outline: none; background: #111 !important; }

/* --- ESTILO LUX FACTORY PARA O BANNER --- */
.full-width-banner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
}

.single-slider {
    width: 100vw !important;
    background-color: #000;
}

/* --- CORREÇÃO DE LINKS E TEXTOS --- */
body {
    background-color: #000000 !important; /* Preto Profundo */
    padding-top: 140px; /* Emra o conteúdo para baixo do menu fixo */
}

a, .main-menu ul li a {
    color: #ffffff !important; /* Branco Inox */
    text-decoration: none !important;
}

h2, p {
    color: #ffffff !important;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8); /* Facilita a leitura sobre a imagem */
}

/* Ajuste para o banner não ficar gigante no celular */
@media (max-width: 768px) {
    .single-slider {
        height: 350px !important;
    }
    body {
        padding-top: 100px;
    }
}

/* Força todos os banners a terem exatamente a mesma altura */
.single-slider {
    height: 600px !important; /* Altura padrão para todos */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    display: flex !important;
    align-items: center !important;
    width: 100%;
}

/* Estilo do Botão Inox Profissional */
.btn-inox {
    background: linear-gradient(145deg, #e6e6e6, #ffffff);
    color: #000 !important;
    padding: 15px 35px;
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    display: inline-block;
    letter-spacing: 1px;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.btn-inox:hover {
    background: #d1d5db;
    transform: scale(1.05);
}

/* Títulos do Banner */
.banner-title {
    font-size: 3.5rem !important;
    text-shadow: 3px 3px 10px rgba(0,0,0,0.9);
    margin-bottom: 10px;
}

/* Ajuste para celular */
@media (max-width: 768px) {
    .single-slider {
        height: 400px !important;
    }
    .banner-title {
        font-size: 2rem !important;
    }
}

/* Força o carrossel a alinhar os itens horizontalmente */
.slider-active {
    display: block !important;
    width: 100% !important;
}

.owl-item {
    float: left; /* Alinha as fotos lado a lado para o script mover */
}

/* Garante que todas as fotos tenham 600px de altura */
.single-slider {
    height: 600px !important; 
    width: 100% !important;
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* Estilo do botão para aparecer em todos */
.btn-inox {
    background: #ffffff;
    color: #000000 !important;
    padding: 12px 30px;
    font-weight: bold;
    display: inline-block;
    margin-top: 15px;
    text-transform: uppercase;
}
/* Força o carrossel a não empilhar as imagens */
.slider-active.owl-carousel {
    display: block !important;
    width: 100% !important;
}

.slider-active .owl-item {
    float: left; /* Essencial para ficarem lado a lado */
}

/* Todos os banners com exatamente o mesmo tamanho */
.single-slider {
    height: 600px !important; 
    background-size: cover !important;
    background-position: center !important;
    display: flex !important;
    align-items: center !important;
}

/* Estilo do botão Inox em todos */
.btn-inox {
    background: #ffffff;
    color: #000 !important;
    padding: 12px 35px;
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
    margin-top: 20px;
    border-radius: 0;
}
/* Impede o empilhamento antes do script carregar */
.slider-active {
    display: flex !important;
    overflow: hidden;
    white-space: nowrap;
}

.slider-active .single-slider {
    flex: 0 0 100%;
    min-width: 100%;
    height: 600px !important; /* Altura idêntica para todos */
    background-size: cover !important;
    background-position: center !important;
}

/* Corrigindo os botões de navegação do slider */
.owl-nav button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,0.2) !important;
    color: #fff !important;
    width: 50px;
    height: 50px;
    font-size: 30px !important;
}

.owl-prev { left: 20px; }
.owl-next { right: 20px; 

}

/* --- AJUSTE DE ALINHAMENTO DO SUBMENU --- */
.main-menu ul li ul {
    text-align: left !important; /* Força o container a alinhar à esquerda */
}

.main-menu ul li ul li {
    display: block !important;
    width: 100% !important;
}

.main-menu ul li ul li a {
    text-align: left !important; /* Alinha o texto da categoria à esquerda */
    display: block !important;
    padding: 15px 20px !important; /* Espaço fixo nas laterais */
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ajuste do efeito de passar o mouse (hover) */
.main-menu ul li ul li a:hover {
    padding-left: 25px !important; /* Mantém o leve recuo que você já tinha, mas partindo da esquerda */
    background: #111 !important;
    color: #ffffff !important;
}
/* --- BLOQUEAR SELEÇÃO DE TEXTO E CURSOR DE DIGITAÇÃO --- */
html, body {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE10+/Edge */
    user-select: none;         /* Padrão (Chrome, Opera, etc) */
    cursor: default;           /* Garante que o mouse continue sendo a seta padrão */
}

/* Permite seleção apenas em campos de busca/formulários (senão o cliente não consegue digitar o produto) */
input, textarea {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    cursor: text;
}

/* --- ESTILO PÁGINA FALE CONOSCO PREMIUM --- */
.representante-card {
    background: #0a0a0a;
    border: 1px solid #1a1a1a;
    padding: 40px;
    border-radius: 4px;
    transition: 0.3s;
    position: relative;
    overflow: hidden;
}

.representante-card:hover {
    border-color: #ff4500; /* Laranja da chama no contorno */
    box-shadow: 0 0 20px rgba(255, 69, 0, 0.2);
}

.img-representante {
    max-width: 220px;
    height: auto;
    filter: drop-shadow(0 0 5px rgba(255,255,255,0.1));
    margin-bottom: 20px;
}

.titulo-premium {
    color: #ffffff !important;
    font-size: 28px !important;
    letter-spacing: 2px;
    margin-bottom: 5px !important;
}

.subtitulo-premium {
    color: #ff4500 !important; /* Laranja Ubenox */
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 25px;
}

.info-representante p {
    color: #d1d5db !important;
    font-size: 16px !important;
    margin-bottom: 12px !important;
}

.info-representante i {
    color: #ff4500;
    margin-right: 10px;
    width: 20px;
}

.contact-form button {
    background: #ff4500 !important;
    color: #fff !important;
    font-weight: bold;
    letter-spacing: 1px;
    border: none;
    padding: 15px 40px;
    transition: 0.3s;
}

.contact-form button:hover {
    background: #e63e00 !important;
    transform: scale(1.02);
}

/* Garante que o banner ocupe o espaço físico e empurre o conteúdo */
.slider-area, .slider-active, .single-slider {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
}

/* Ajusta a imagem de fundo para não cortar errado */
.single-slider {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* Ajuste do menu fixo para não dar conflito com o topo */
.header-fixed {
    position: fixed;
    width: 100%;
    z-index: 999;
}
.woocommerce-breadcrumb, .breadcrumb {
    background-color: #0a0a0a !important; /* Fundo quase preto */
    color: #ffffff !important; /* Texto branco */
    border: 1px solid #1a1a1a;
    padding: 15px;
}
.woocommerce-breadcrumb a, .breadcrumb a {
    color: #888 !important; /* Links em cinza */
}
.single-feature {
    background: #050505 !important; /* Seu preto padrão */
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important; /* Ocupa toda a altura da coluna */
    border: 1px solid transparent !important; /* Sem borda inicial */
    transition: 0.3s ease-in-out !important;
    overflow: hidden;
}

/* Imagem com altura fixa para não empurrar o layout */
.feature-image {
    height: x !important; 
    background-size: cover !important;
    background-position: center !important;
    width: 100% !important;
}

/* Título centralizado com altura mínima */
.feature-text h2 {
    padding: 20px 10px !important;
    margin: 0 !important;
    font-size: 26px !important;
    color: #ffffff !important;
    min-height: 70px !important; /* Garante que títulos longos não desalinhem o grid */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-transform: uppercase !important;
}

/* Efeito Hover (Sobe e Ganha Borda) */
.single-feature:hover {
    transform: translateY(-5px) !important; /* Sobe sem empurrar os outros */
    border-color: #ffffff !important; /* Borda branca Inox */
    box-shadow: 0 15px 40px rgba(0,0,0,0.8) !important;
}
