/* ========================= */
/* style__container__cv */
/* ========================= */
.conteiner__cv {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between; /* Distribuir contenido con espacio entre header y footer */
    min-height: 100vh; /* Asegura que ocupe toda la altura de la pantalla */
    padding: 1rem; /* Espaciado interno */
    box-sizing: border-box;
    animation: scaleUp 1s ease-out; /* Animación de escala */
}
/* Imagen contenedora */
.cvImage__cv {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Animaciones */
    width: 80%; /* Por defecto ocupa el 80% del ancho */
    max-width: 900px; /* Máximo tamaño en pantallas normales */
}
.cvImage__cv img {
    max-width: 85%; /* Imagen nunca excede el tamaño del contenedor */
    height: auto; /* Mantiene la proporción */
    cursor: pointer; /* Cursor cambia al pasar por la imagen */
    border-radius: 10px; /* Bordes redondeados */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Animaciones suaves */
    margin-top: 2rem;
}
/* Efecto hover para las imágenes */
.cvImage__cv img:hover {
    transform: scale(1.02); /* Zoom suave */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3); /* Sombra */
}
/* Lightbox styles */
.lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.3s, opacity 0.3s;
}
.lightbox.visible {
    visibility: visible;
    opacity: 1;
}
.lightbox__image {
    max-width: 90%;
    max-height: 80%;
    border-radius: 10px;
    box-shadow: 0 8px 15px rgba(255, 255, 255, 0.3);
}
.lightbox__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    font-size: 3rem;
    color: var(--blanco);
    cursor: pointer;
    transition: color 0.3s;
}
.lightbox__close:hover {
    color: var(--azulClaro);
}
@keyframes scaleUp {
    0% { transform: scale(0.8); }
    100% { transform: scale(1); }
}
/* ========================= */
/* Responsive styles */
/* ========================= */
/* Para dispositivos pequeños: max-width 480px */
@media (max-width: 480px) {
    .conteiner__cv {
        justify-content: flex-start; /* Alinea el contenido hacia la parte superior */
        padding-top: 2rem; /* Reduce el margen superior */
        min-height: auto; /* Permite que el contenedor se ajuste automáticamente al contenido */
        height: auto; /* Evita que ocupe toda la altura de la ventana */
    }
    .cvImage__cv {
        width: 100%; /* Ocupa todo el ancho disponible */
    }

    .cvImage__cv img {
        margin-bottom: 1rem; /* Reduce espacio inferior */
    }

    .lightbox__close {
        font-size: 2rem; /* Ajusta el tamaño del icono de cerrar */
    }
}
/* Para tablets: max-width 768px */
@media (max-width: 768px) {
    .conteiner__cv {
        justify-content: flex-start;
        padding-top: 2.5rem;
    }
    .cvImage__cv {
        width: 90%; /* Ajusta el ancho */
    }

    .cvImage__cv img {
        margin-bottom: 1rem; /* Reduce espacio adicional */
    }
}
/* Para pantallas horizontales grandes */
@media (orientation: landscape) {
    .cvImage__cv {
        width: 70%; /* Limita el ancho a un 70% del contenedor */
        max-width: 800px; /* Reduce el tamaño máximo */
    }
}
/* ========================= */
/* END style__container__cv */
/* ========================= */
