/* ==========================================================================
   1. IMPORTAÇÃO DE FONTES & VARIÁVEIS
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
    --primary-color: #003344;       /* Deep Teal */
    --secondary-color: #00A9E4;     /* Cyan */
    --dark-bg: #05080a;             /* Preto Profundo Premium */
    --card-bg: #0f1519;             /* Cinza Azulado Escuro */
    --text-light: #ffffff;
    --text-gray: #b0b8c1;
    --transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ==========================================================================
   2. RESET E BASE
   ========================================================================== */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 110px;
}

body {
    font-family: 'Poppins', sans-serif;
    background-color: var(--dark-bg);
    color: var(--text-light);
    overflow-x: hidden;
    line-height: 1.7;
}

a {
    text-decoration: none;
}

/* ==========================================================================
   3. NAVBAR (MENU)
   ========================================================================== */
.navbar {
    padding: 0.5rem 0;
    background: rgba(0, 20, 30, 0.95);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    height: 100px;
    z-index: 1000;
}

.navbar-brand {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}

.navbar-brand img {
    height: 100px;
    width: auto;
    position: absolute;
    top: -5px;
    left: 0;
    z-index: 1001;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.4));
    transition: var(--transition);
}

@media (max-width: 991px) {
    .navbar { height: auto; padding: 1rem 0; }
    .navbar-brand img { height: 70px; position: relative; top: 0; }
}

.nav-link {
    color: #e0e0e0 !important;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-left: 2rem;
    position: relative;
    transition: var(--transition);
}

.nav-link:hover, .nav-link.active { color: var(--secondary-color) !important; }

.nav-link::after {
    content: ''; position: absolute; width: 0; height: 2px; bottom: -5px; left: 0;
    background-color: var(--secondary-color); transition: var(--transition);
}
.nav-link:hover::after { width: 100%; }

/* ==========================================================================
   4. BOTÕES GERAIS
   ========================================================================== */
.btn-cyan {
    background: var(--secondary-color); color: #fff; font-weight: 700;
    font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1px;
    border-radius: 4px; padding: 14px 35px; border: 1px solid var(--secondary-color);
    box-shadow: 0 0 20px rgba(0, 169, 228, 0.15); transition: var(--transition);
}
.btn-cyan:hover {
    background: transparent; color: var(--secondary-color);
    box-shadow: 0 0 30px rgba(0, 169, 228, 0.4); transform: translateY(-2px);
}

/* ==========================================================================
   5. HERO SECTION (CARROSSEL)
   ========================================================================== */
.hero-section { height: 90vh; min-height: 700px; position: relative; z-index: 1; }
.carousel-item {
    height: 90vh; min-height: 700px; background-size: cover; background-position: center;
    transition: transform 2s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 1s ease-in-out;
}
.hero-overlay {
    background: linear-gradient(90deg, rgba(0, 10, 15, 0.9) 0%, rgba(0, 51, 68, 0.4) 100%);
    width: 100%; height: 100%; display: flex; align-items: center;
}
.hero-content h1 { font-size: 4rem; font-weight: 800; letter-spacing: -1px; line-height: 1.1; }

@media (max-width: 768px) {
    .hero-content h1 { font-size: 2.5rem; word-wrap: break-word; }
    .hero-content p.lead { font-size: 1rem; }
    .carousel-item { min-height: 600px; }
}

.carousel-control-prev, .carousel-control-next { width: 8%; opacity: 1; }
.carousel-arrow {
    width: 60px; height: 60px; border-radius: 50%;
    background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    display: flex; align-items: center; justify-content: center;
    transition: all 0.3s ease;
}
.carousel-arrow i { font-size: 1.5rem; color: #fff; }
.carousel-control-prev:hover .carousel-arrow, .carousel-control-next:hover .carousel-arrow {
    background: var(--secondary-color); border-color: var(--secondary-color);
    transform: scale(1.1); box-shadow: 0 0 20px rgba(0, 169, 228, 0.4);
}

/* ==========================================================================
   6. SEÇÃO UNIDADES DE NEGÓCIO (BUs)
   ========================================================================== */
.bu-section-wrapper { position: relative; z-index: 10; padding-top: 80px; padding-bottom: 80px; background-color: var(--dark-bg); }
.bu-card {
    background: linear-gradient(145deg, #121a1f 0%, #080c0e 100%);
    border: 1px solid rgba(255, 255, 255, 0.05); border-radius: 12px; padding: 3rem 2rem;
    height: 100%; transition: var(--transition); cursor: pointer; position: relative;
}
.bu-card:hover, .bu-card.active-bu {
    border-color: var(--secondary-color); transform: translateY(-10px);
    box-shadow: 0 20px 50px rgba(0, 169, 228, 0.15);
    background: linear-gradient(145deg, #1a252b 0%, #080c0e 100%);
}
.bu-card.active-bu::after {
    content: ''; position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%);
    border-width: 10px; border-style: solid;
    border-color: var(--secondary-color) transparent transparent transparent;
    opacity: 0; transition: opacity 0.3s;
}
.bu-card.active-bu::after { opacity: 1; }
.bu-icon { font-size: 2.8rem; color: var(--secondary-color); margin-bottom: 1.5rem; }
.bu-details-container { margin-top: 20px; }
.detail-box {
    background: linear-gradient(180deg, rgba(15, 21, 25, 0.95) 0%, rgba(0, 51, 68, 0.2) 100%);
    border: 1px solid var(--secondary-color); border-radius: 15px; padding: 40px;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.5);
}
.bu-detail-content { opacity: 0; transform: translateY(-20px); transition: all 0.5s ease; }
.bu-detail-content.fade-in { opacity: 1; transform: translateY(0); }
.service-item {
    background: rgba(255, 255, 255, 0.03); padding: 20px; border-radius: 8px;
    height: 100%; border-left: 3px solid var(--secondary-color);
}

/* ==========================================================================
   7. SEÇÃO SOBRE
   ========================================================================== */
.quote-box { border-left: 4px solid var(--secondary-color); padding-left: 30px; margin-top: 40px; }
.quote-text { font-size: 1.5rem; font-style: italic; color: #fff; font-weight: 300; line-height: 1.5; }

/* ==========================================================================
   8. FOOTER
   ========================================================================== */
footer { background-color: #020304; padding-top: 6rem; border-top: 1px solid rgba(255, 255, 255, 0.05); }
footer h5 { color: #fff; font-size: 1rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 1.5rem; }
footer img { display: block; margin-left: 0; }
footer a { color: var(--text-gray) !important; font-size: 0.9rem; transition: var(--transition); }
footer a:hover { color: var(--secondary-color) !important; padding-left: 5px; }
.copyright-text { color: #d0d0d0; font-size: 0.9rem; font-weight: 500; }

/* ==========================================================================
   9. FORMULÁRIO DE CONTATO
   ========================================================================== */
.contact-wrapper { background: #0f1519; padding: 40px; border-radius: 15px; border: 1px solid rgba(255, 255, 255, 0.05); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3); }
.form-control { background-color: #05080a; border: 1px solid #2a3b45; color: #fff; padding: 15px; border-radius: 8px; }
.form-control::placeholder { color: rgba(255, 255, 255, 0.5) !important; opacity: 1; }
.form-control:focus { background-color: #05080a; border-color: var(--secondary-color); color: #fff; box-shadow: 0 0 10px rgba(0, 169, 228, 0.2); }
.form-label { color: var(--secondary-color); font-weight: 600; margin-bottom: 10px; }

/* ==========================================================================
   10. WHATSAPP FLUTUANTE
   ========================================================================== */
.whatsapp-float { position: fixed; width: 60px; height: 60px; bottom: 30px; right: 30px; background-color: #25d366; color: #FFF; border-radius: 50px; text-align: center; font-size: 30px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4); z-index: 1000; display: flex; align-items: center; justify-content: center; transition: var(--transition); animation: pulse 2s infinite; }
.whatsapp-float:hover { transform: scale(1.1); color: #fff; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); } 70% { box-shadow: 0 0 0 15px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }

/* ==========================================================================
   11. BANNER DE COOKIES (LGPD)
   ========================================================================== */
.cookie-banner { position: fixed; bottom: -100%; left: 0; width: 100%; background: rgba(5, 8, 10, 0.95); backdrop-filter: blur(10px); border-top: 1px solid rgba(255, 255, 255, 0.1); padding: 20px 0; z-index: 10000; transition: bottom 0.6s cubic-bezier(0.25, 0.8, 0.25, 1); box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5); }
.cookie-banner.show { bottom: 0; }
.cookie-text { color: #b0b8c1; font-size: 0.9rem; margin-bottom: 0; }
.cookie-link { color: var(--secondary-color); text-decoration: underline; cursor: pointer; }
.cookie-btn { background: var(--secondary-color); color: #fff; border: none; padding: 8px 25px; border-radius: 4px; font-weight: 600; font-size: 0.85rem; text-transform: uppercase; transition: all 0.3s; }
.cookie-btn:hover { background: #fff; color: var(--primary-color); box-shadow: 0 0 15px rgba(255, 255, 255, 0.3); }

/* ==========================================================================
   12. SEÇÃO PARCEIROS (MONOCROMÁTICA & ELEGANTE)
   ========================================================================== */
.partners-section {
    padding: 80px 0;
    background-color: var(--dark-bg);
}

.partner-card {
    /* Estilo "Caixa" Sutil */
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    height: 130px; 
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    padding: 25px; 
    position: relative;
    overflow: hidden;
}

.partner-logo {
    width: auto;
    max-width: 90%;
    /* Altura controlada no HTML */
    object-fit: contain;
    
    /* Estado Normal: Branco com transparência (Cinza claro) */
    filter: brightness(0) invert(1);
    opacity: 0.5; 
    transition: all 0.4s ease;
}

/* --- HOVER EFFECT (SEM COR, APENAS DESTAQUE) --- */
.partner-card:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: var(--secondary-color); /* Borda Ciano */
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(0,0,0,0.4);
}

.partner-card:hover .partner-logo {
    opacity: 1; /* Fica 100% visível */
    transform: scale(1.1); /* Leve zoom */
    
    /* MANTÉM BRANCO (Não remove o filtro) e adiciona brilho branco intenso */
    filter: brightness(0) invert(1) drop-shadow(0 0 5px rgba(255, 255, 255, 0.8));
}