/* assets/css/contact-page.css */

.contact-header {
    background-color: #f8f9fa; /* Tu color de fondo */
    border-bottom: 1px solid #dee2e6;

    /* --- CAMBIOS PARA ANCHO COMPLETO --- */
    width: 100vw; /* Ocupa el 100% del ancho de la ventana */
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw; /* Truco para romper el contenedor padre y centrar */
    margin-right: -50vw;
    padding-top: 3rem; /* Ajusta el padding a tu gusto */
    padding-bottom: 3rem;
}
/* --- ESTILOS PARA LA IMAGEN DE CONTACTO (FORZADO) --- */

/* Contenedor de la imagen */
.contact-content .col-lg-6 img {
    width: 100% !important;          /* Fuerza el ancho completo */
    height: 820px !important;        /* Fuerza la altura exacta que quieres */
    object-fit: cover !important;    /* Asegura que la imagen no se deforme */
    /* Usa valores negativos para SUBIR y positivos para BAJAR */
    margin-top: -75px !important; /* Ejemplo: Sube la imagen 30px */
    object-position: center !important; 
    display: block !important;       /* Evita espacios extra debajo de la imagen */
}

/* Opcional: Centrar el formulario verticalmente */
.contact-content .row {
    align-items: center; 
}

/* Animación de entrada sutil */
.contact-content .row {
    animation: fadeIn 0.8s ease-out;
}

@keyframes fadeIn {
  from { 
    opacity: 0; 
    transform: translateY(20px); 
  }
  to { 
    opacity: 1; 
    transform: translateY(0); 
  }
}