/* css/styles.css */
:root {
    --azul-corelabs: #1500da;
    --verde-corelabs: #7dff13;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    color: #333;
    line-height: 1.6;
}

/* Navegación */
nav {
    background: white;
    padding: 10px 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.logo-img {
    height: 70px; 
    width: auto;
    display: block;
}

.flags a {
    text-decoration: none;
    margin-left: 15px;
    font-size: 1.5rem;
}

/* La banda azul CoreLabs */
.hero {
    background: var(--azul-corelabs);
    color: white;
    padding: 4rem 2rem;
    text-align: center;
}

/* Contenedores y tarjetas */
.container { max-width: 1000px; margin: auto; padding: 2rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; }
.card { background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); border: 1px solid #ddd; }

/* CONTENEDOR LUPA (Sustituye al placeholder) */
.img-container {
    background: #f0f0f0;
    height: 300px; /* Altura del cuadro de la foto */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Importante para que el zoom no se salga de la tarjeta */
    border-radius: 4px;
    margin-bottom: 1rem;
    position: relative;
    border: 1px solid #ddd;
    cursor: crosshair;
}

.img-responsive {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform 0.1s ease-out; /* Movimiento fluido */
    transform-origin: center center;
    display: block;
}

/* /* Zoom al pasar el ratón */ */
 .img-container:hover .img-responsive { */
     transform: scale(2.5); // Nivel de ampliación  */
 } */



/* 🚀 FILTRO PARA MÓVILES: El zoom de la lupa SOLO se activa si el dispositivo tiene ratón real */
/* @media (hover: hover) { */
/*     .img-container:hover .img-responsive { */
/*         transform: scale(2.5); /* Nivel de ampliación */ */
/*         cursor: zoom-in; */
/*     } */
/* } */

/* 🚀 EL PARCHE DEFINITIVO: El zoom solo se activa si el dispositivo emula hover Y tiene un puntero preciso (Ratón/Trackpad) */
/* @media (hover: hover) and (pointer: fine) { */
/*     .img-container:hover .img-responsive { */
/*         transform: scale(2.5); /* Nivel de ampliación */ */
/*         cursor: zoom-in; */
/*     } */
/* } */

/*footer { background: #1500da; color: white; text-align: center; padding: 2rem; margin-top: 4rem; }*/

/* Estilos para el Footer Azul */
footer {
    background-color: var(--azul-corelabs);
    color: white;
    text-align: center;
    padding: 2rem;
    margin-top: 4rem;
}

/* Forzar que el enlace del email sea blanco */
footer a {
    color: white !important; /* El !important asegura que gane al color por defecto */
    text-decoration: none;   /* Quita el subrayado feo */
    font-weight: bold;       /* Un poco más de grosor para que se lea mejor */
}

/* Efecto al pasar el ratón para que el usuario sepa que es un link */
footer a:hover {
    text-decoration: underline;
    color: var(--verde-corelabs) !important; /* Usa tu verde CoreLabs al pasar el ratón, queda de lujo */
}