/*
 Archivo: /css/footer.css - Diseño Moderno: Verde Oliva y Dorado
 Paleta: Verde Oliva Profundo (#4F7942), Dorado (#FFD700), Gris Carbón (#2C3E50)
*/

/* ------------------ Base del Footer ------------------ */
.main-footer {
 background-color: #99b091; /* ⬅️ Verde Oliva Profundo (Base Principal) */
 color: #ffffff; 
 font-family: 'Open Sans', sans-serif;
 padding-top: 10px; 
 padding-bottom: 0; 
}

/* Contenedor Principal de las Secciones */
.footer-content-wrapper {
 display: flex;
 flex-wrap: wrap; 
 justify-content: space-between; 
 align-items: flex-start; 
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 40px 60px; 
}

/* ------------------ Estilos Comunes de Secciones ------------------ */
.footer-section {
 width: 100%; 
}

.footer-section h3 {
 font-family: 'Montserrat', sans-serif;
 font-weight: 700;
 font-size: 1.3rem; 
 margin-bottom: 25px; 
 color: #635400; /* Dorado para el acento */
 position: relative;
}

/* Subrayado sutil para los títulos del footer */
.footer-section h3::after {
 content: '';
 display: block;
 width: 40px; 
 height: 3px;
 background-color: #635400; 
 margin-top: 8px;
}

/* ------------------ Logo y Marca (Ajustes de Tamaño del Logo a 70px) ------------------ */
.footer-logo-link {
 /* Mantenemos el display flex y align-items: center para la alineación vertical perfecta */
 display: flex;
 align-items: center; 
 text-decoration: none;
}

.footer-logo {
 width: 70px; /* Tamaño prominente */
 height: auto;
 margin-right: 15px;
}

/* CONTENEDOR DE TEXTO CORREGIDO: apila la marca y el eslogan */
.footer-brand-text {
    display: flex;
    flex-direction: column; 
}

.footer-brand-name {
 font-size: 2.0rem; 
 color: #635400; 
    display: block; /* Asegura que ocupe el ancho y el eslogan quede debajo */
}

.footer-brand-slogan {
 /* Color: Un blanco sutil para contraste con el nombre */
 font-size: 0.9rem;
 color: #000000; 
    display: block; /* Importante para que salte de línea */
    margin-top: 2px; /* Espacio mínimo entre nombre y eslogan */
}

/* ------------------ Navegación y Enlaces ------------------ */
.footer-section ul {
 list-style: none;
 padding: 0;
 margin: 0;
 line-height: 1.6; 
}

.footer-section a {
 color: black;
 font-size: 1rem;
 transition: color 0.3s;
}

.footer-section a:hover {
 color: #413700; /* Resalta en dorado */
 text-decoration: none; 
}

/* ------------------ Redes Sociales ------------------ */
.social-icons {
 display: flex;
 gap: 20px; 
 margin-bottom: 25px;
}

.social-icons a {
 font-size: 1.8rem; 
 color: #ffffff;
}

.social-icons a:hover {
 color: #FFD700; /* Resalta en dorado al pasar el cursor */
}

.contact-email {
 /* Color de texto para el email */
 color: black; 
}

/* ------------------ Bottom Bar (Copyright) ------------------ */
.footer-bottom {
background-color: #091807; /* ⬅️ Verde Oscuro (Base Oscura para contraste) */
padding: 1px 10px; /* <--- ESTO ESTABA FALTANDO: Padding para espacio interno */
text-align: center;
border-top: 1px solid rgba(255, 255, 255, 0.1); /* Mantenemos la línea divisoria */
color: #635400; /* Color de texto del copyright */
}
/* ... Media Queries (Para el diseño responsive) ... */
@media (min-width: 768px) {
 /* Distribución en 4 columnas */
 .footer-brand { width: 30%; }
 .footer-links, .footer-info { 
  width: 18%; 
  border-right: 1px solid rgba(255, 255, 255, 0.1); 
  padding-right: 20px;
 }
 .footer-social { width: 25%; padding-left: 20px; } 

 /* Limpiamos el borde de la última columna de listas */
 .footer-info {
  border-right: none;
 }
 
 .copyright-mobile { display: none; }
 .copyright-desktop { display: block; } 
}