/* Reset básico */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Encabezado */
header {
  background-color: #ffffff;
  color: white;
  font-family: Arial, sans-serif;
  padding-bottom: 0%;
}

.logo img {
  width: 250px;
  height: auto;
  object-fit: contain;
}


/* Contenido de contacto */
.container {
  max-width: 800px;
  margin: auto;
  padding: 30px;
}

.formulario {
  background-color: white;
  padding: 20px 30px;
  border-radius: 8px;
  align-items: center;
  text-align: center;
  box-shadow: 0px 4px 8px #752A2E;
  margin: 40px auto;
  display: block;
  max-width: 600px;
}

.formulario h2 {
  color: #6f752c;
}

input, select, textarea {
  width: 100%;
  padding: 10px;
  margin-top: 10px;
  margin-bottom: 20px;
  border: 1px solid #ccc;
  border-radius: 4px;
}


.titulo-oficinas { color: #6f752c; margin-bottom: 20px; text-align: center; }

.oficinas { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
.oficina {
  flex: 1 1 350px;
  background-color: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
iframe { width: 100%; height: 250px; border: none; border-radius: 4px; }

.contact-box {
  background-color: #fff;
  border-color: #752A2E;
  border-style: dotted;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  padding: 40px;
  margin: 40px auto;
  max-width: 800px;
  text-align: center;
}
.contact-box h2 { color: #752A2E; margin-bottom: 30px; font-size: 28px; }

.icon-row { display: flex; justify-content: center; gap: 40px; margin-bottom: 30px; }
.icon-item { font-size: 32px; color: #6f752c; cursor: pointer; transition: transform 0.2s ease; }
.icon-item:hover { transform: scale(1.2); }

.info-box { display: none; margin: 10px 0; font-size: 18px; }
.info-box a { color: #6f752c; text-decoration: none; font-weight: 500; }
.info-box a:hover { text-decoration: underline; }
.button {
  background:#6f752c; color:#fff; padding:10px 16px; font-size:16px;
  border:none; cursor:pointer; border-radius:4px;
}

    footer {
      background-color: #ffffff;
      color: rgb(0, 0, 0);
      text-align: center;
      padding: 20px;
      margin-top: 40px;
      font-family: 'Lato', sans-serif;


    }

    footer a {
      color: #000000;
      text-decoration: underline;
      margin-left: 10px;
    }
  .button {
  background:#6f752c !important; color:#fff !important; padding:10px 16px !important; font-size:16px !important;
  border:none !important; cursor:pointer !important; border-radius:4px !important;
}

    /* === Configuraciones del menú Bootstrap === */
/* Tamaño del encabezado */
header {
  background-color: #ffffff;
  padding: 20px 0; /* Aumenta el espacio vertical */
}

.navbar {
  min-height: 100px; /* altura mínima del header */
}

.navbar-brand img {
  height: 80px; /* Ajusta el tamaño del logo */
  width: auto;
}



/* Color de los enlaces del menú */
.navbar-dark .navbar-nav .nav-link {
  background-color: #6f752c; /* 💚 color de tus botones */
  color: #fff !important;
  margin: 0 5px;
  border-radius: 4px;
  padding: 8px 16px;
  transition: background-color 0.3s ease;
}

/* Hover (al pasar el mouse) */
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  background-color: #34495e !important; /* gris-azulado de hover */
  color: #fff !important;
}

/* Dropdown menú */
.dropdown-menu {
  background-color: #01200b; /* verde oscuro original */
}

.dropdown-menu .dropdown-item {
  color: #fff;
}

.dropdown-menu .dropdown-item:hover {
  background-color: #bdc3c7;
  color: #000;
}

/* 🔧 Submenús siempre dentro de la pantalla */
.dropdown-menu {
  background-color: #01200b;
  border-radius: 4px;
  color: #fff;
  border: none;
  min-width: 180px;
  white-space: nowrap;
  overflow: hidden;
}

/* Asegura que los submenús a la derecha no se salgan */
.nav-item.dropdown:last-child .dropdown-menu,
.navbar-nav > li:last-child .dropdown-menu {
  left: auto !important;
  right: 0 !important; /* se abre hacia la izquierda */
  transform: none !important;
}

/* Hover */
.dropdown-item {
  color: #fff;
}

.dropdown-item:hover {
  background-color: #bdc3c7;
  color: #000;
}

/* 🔥 Estilo para el enlace activo del menú */
.nav-link.active {
  background-color: #636363 !important; /* mismo fondo que tenías */
  color: white !important;
  font-weight: bold;
  border-radius: 4px;
}

/* ================================
   ⭐ MENÚ RESPONSIVO (MÓVIL)
   Color verde #6f752c
   ================================ */

/* Fondo del menú cuando se despliega */
.navbar-collapse {
  background-color: #ffffff !important; /* fondo blanco */
  padding: 15px 0;
}

/* Enlaces dentro del menú */
.navbar-nav .nav-link {
  background-color: #6f752c !important;
  color: #ffffff !important;
  margin: 5px 10px;
  border-radius: 4px;
  padding: 10px 15px;
  text-align: center;
}

/* Hover de enlaces */
.navbar-nav .nav-link:hover {
  background-color: #505525 !important;
  color: #ffffff !important;
}

/* Botón hamburguesa (fondo) */
.navbar-dark .navbar-toggler {
  background-color: #ffffff !important; /* fondo blanco */
  border: 2px solid #6f752c !important;
  border-radius: 6px;
  padding: 6px 10px;
}

/* Ícono de las 3 rayitas (verde) */
.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%236f752c' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(111,117,44,1)' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Fondo del dropdown en móvil */
.dropdown-menu {
  background-color: #6f752c !important;
  border-radius: 4px;
  border: none;
  padding: 0;
}

/* Items del dropdown */
.dropdown-item {
  color: #ffffff !important;
  padding: 10px 15px;
  text-align: left;
}

/* Hover del dropdown */
.dropdown-item:hover {
  background-color: #505525 !important;
  color: #ffffff !important;
}

/* Item activo */
.dropdown-item.active{
  background-color: #636363 !important; /* mismo fondo que tenías */
  color: #ffffff !important;
}

/* Link activo principal */
.nav-link.active {
  background-color: #636363 !important; /* mismo fondo que tenías */

  color: #ffffff !important;
}