/* 
====================================================
  CSS Customizado - Ritter Advogados
  Autor: Seu Nome
  Descrição: Este arquivo contém estilos adicionais
  e personalizações para o tema Bootstrap.
====================================================
*/

/* --------------------------------------------------
   1. Configurações Gerais
-----------------------------------------------------*/

/* Fonte geral */
body {
    font-family: 'Montserrat', sans-serif;
  }
  
  /* Cores personalizadas */
  :root {
    --gold-color: #BFA351; /* Ajuste conforme a cor dourada de preferência */
    --black-color: #000000;
    --white-color: #ffffff;
  }
  
  /* Classes de utilitários */
  .text-gold {
    color: var(--gold-color) !important;
  }
  .bg-black {
    background-color: var(--black-color) !important;
  }
  .btn-gold {
    background-color: var(--gold-color);
    color: var(--white-color);
    border: none;
    transition: background-color 0.3s ease;
  }
  .btn-gold:hover {
    background-color: #d4b45e; /* Efeito hover para o botão */
  }
  
  /* Logo */
  .logo-img {
    max-width: 170px;
    height: auto;
  }
  
  /* --------------------------------------------------
     2. Navbar
  -----------------------------------------------------*/
  .navbar-dark .navbar-toggler-icon {
    background-image: none;
  }
  .navbar-dark .navbar-toggler {
    border-color: var(--gold-color);
  }
  .navbar-dark .navbar-toggler-icon::before {
    content: "\f0c9";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: var(--gold-color);
  }
  
  /* Links do menu */
  .nav-link {
    color: var(--white-color) !important;
    margin-left: 1rem;
    transition: color 0.3s ease;
  }
  .nav-link:hover {
    color: var(--gold-color) !important;
  }
  
  /* --------------------------------------------------
     3. Hero Section
  -----------------------------------------------------*/
  .hero-section {
  position: relative;
  overflow: hidden;
  height: 80vh; /* Altura da seção hero */
}

/* Vídeo de fundo */
.hero-video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: 1;
  object-fit: cover;
}

/* Sobreposição escura */
.hero-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.6));
  z-index: 2;
}

/* Conteúdo da seção acima do vídeo e overlay */
.hero-section .container {
  position: relative;
  z-index: 3;
}

.hero-title {
  font-size: 2.5rem;
  font-weight: 700;
}


  
  /* --------------------------------------------------
     4. Animações e Transições Avançadas
  -----------------------------------------------------*/
  
  /* Fade-in simples */
  @keyframes fadeIn {
    0% {
      opacity: 0;
      transform: translateY(10px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  .animate-fade-in {
    animation: fadeIn 0.8s ease forwards;
  }
  
  .animate-fade-in-delayed {
    animation: fadeIn 1.2s ease forwards;
  }
  
  /* Fade-up */
  @keyframes fadeUp {
    0% {
      opacity: 0;
      transform: translateY(30px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  .animate-fade-up {
    animation: fadeUp 0.8s ease forwards;
  }
  
  /* --------------------------------------------------
     5. Seções Gerais
  -----------------------------------------------------*/
  
  /* Ajuste de título das seções */
  section h2 {
    font-size: 2rem;
    font-weight: 700;
  }
  
  /* Cartões (cards) */
  .card {
    border-radius: 8px;
  }
  
  /* --------------------------------------------------
     6. Formulário de Contato
  -----------------------------------------------------*/
  #contact .form-label {
    font-weight: 600;
  }
  
  /* --------------------------------------------------
     7. Footer
  -----------------------------------------------------*/
  footer p {
    font-size: 0.9rem;
    margin: 0;
  }
  
  /* Responsividade adicional */
  @media (max-width: 768px) {
    .hero-title {
      font-size: 1.8rem;
    }
  }