/*=========== GLOBALES =============*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');

body {
    font-family: 'Montserrat', sans-serif;
    overflow-x: hidden;
}

/*============== MENU ==============*/
#menu li > a {
    font-size: 18px;
    font-weight:bold;
    color: #3f3f3f;
}

#menu form > button {
    font-size: 18px;
    font-weight:bold;
}

/*======= SLIDER DE IMAGENES =======*/
.carousel-inner {
    max-height: 39rem;
}

/* ============ PRODUCTOS (CATÁLOGO) ============ */
/*
    Ajuste CLAVE: Se añaden las propiedades de object-fit y object-position
    para asegurar que las imágenes de producto se vean completas (contain)
    y centradas.
*/
.card-img {
    object-fit: contain;
    object-position: center;
}

/*======= MEDIA QUERIES PANTALLA SM =======*/

@media (max-width:768px){
    #intro #equipo{
        width:90% !important;
    }

    #equipo p {
        display: none;
    }

    .servicio-fila{
        width: 100% !important;
        text-align: center;
    }
    
    /* Regla ajustada para mover la sección de contacto en móvil */
    #bg-contacto {
        position:relative;
        top:-110px;
    }
}

/*======= MEDIA QUERIES PANTALLA ANCHA =======*/
@media(max-width:1200px){
    #local{
        flex-wrap: wrap;
        padding-top:30px;
    }

    .wrapper{
        width: 90%;
        margin: auto;
        padding-top: 50px;

    }
}

/*======= MEDIA QUERIES PANTALLA EXTRA-SM =======*/

@media(max-width:576px){
    .icono-wrap{
        flex-wrap: wrap;
        justify-content: center !important;
    }
}

/*======= CONTACTOS BACKGROUND =======*/
#bg-contacto {
    position:relative;
    top:-130px;
}

/* Sección de Contacto: 
    Nota: La regla 'min-height: 550px' podría ser demasiado restrictiva. 
    Permitiremos que el contenido defina la altura, pero se mantiene para consistencia.
*/
#seccion-contacto {
    background-color: #1b2a4e;
    min-height: 550px; 
    display: flex; 
    justify-content: center; 
    align-items: center;
}

/*======= CONTACTOS FORMULARIO =======*/
#contenedor-formulario{
    background:#fbfafa ;
    border-radius: 5px;
    padding: 20px; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
}

#titulo-formulario {
    color: #3f3f3f;
}

/*======= MAPA =======*/

/* CLAVE 1: Anula Flexbox o Grid en el contenedor padre */
#local {
    display: block !important; 
}

/* CLAVE 2: Asegura que el contenedor de texto ocupe todo el ancho y se comporte como bloque */
.texto-ubicacion {
    width: 100% !important; 
    display: block !important; 
    margin-bottom: 20px;
}

/* CLAVE 3: Asegura que el mapa se comporte como un bloque de ancho completo */
.mapa-incrustado {
    width: 100% !important; 
    display: block !important; 
    height: 450px; 
    border: none; 
}


#local {
    background-color: #f3f3f3;
    display:flex;
    justify-content: center;
}

.wrapper{
    width: 50%;
    margin-left: 100px;
    padding-top:150px ;
}

/*======= FOTTER =======*/
footer {
    background: #1b2a4e;
    min-height:100px;
}

footer p {
color: #f3f3f3;
text-align: center;
}

#iconos i {
    font-size: 26px;
    padding: 0 8px;
    color:#f3f3f3
}