/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/


/* -------------------------------------------------------------------------------------------------------------
   ------------------------------------- INICIO ITred Spa logo_cabecera .CSS -----------------------------------
   ------------------------------------------------------------------------------------------------------------- */

/* IMPORTACION DE FUENTE RALEWAY */

@font-face {
    font-family: 'Raleway'; /* establece el nombre de la fuente que podrá utilizar el sitio */
    src: url('/fuentes/fuentes_google/fuente_raleway.ttf') format('truetype'); /* establece la ruta del archivo de fuente y su formato */
    font-weight: 100 900; /* permite utilizar los diferentes grosores disponibles de la fuente */
    font-style: normal; /* establece el estilo normal de la fuente */
}


/* TITULO 1 CONTENEDOR LOGO CABECERA */

    .logo_cabecera {
        display: flex; /* organiza el contenido mediante una estructura flexible */
        align-items: center; /* centra verticalmente la imagen */
        justify-content: flex-start; /* posiciona la imagen hacia el lado izquierdo */
    }


    /* SUBTITULO 1 IMAGEN LOGO CABECERA */

        .imagen_logo_cabecera {
            width: 12vw; /* establece el ancho proporcional al ancho de la pantalla */
            min-width: 11rem; /* establece el ancho minimo de seguridad */
            max-height: 25vh; /* limita la altura maxima al 25% del visor */
            height: auto; /* mantiene la relacion de aspecto original */
            object-fit: contain; /* ajusta la escala sin recortar ni deformar la imagen */
            cursor: pointer; /* establece el cursor de clic activo */
            transition: transform 0.3s ease; /* establece una transicion suave para la escala */
        }


    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                min-width: 10.5rem; /* reduce ligeramente el ancho minimo del logo */
            }

    }


    /* notebooks comunes (1366x768, MacBook Air/Pro) */
    @media (max-width: 1200px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                width: 14vw; /* aumenta proporcionalmente el ancho del logo */
                min-width: 10rem; /* reduce el ancho minimo para notebooks comunes */
            }

    }


    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

        .imagen_logo_cabecera {
            width: 16vw; /* adapta el ancho del logo para pantallas medianas */
            min-width: 9rem; /* mantiene un ancho minimo para conservar su legibilidad */
            max-height: 75px; /* evita que el logo crezca excesivamente en pantallas altas */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                width: 20vw; /* adapta el ancho del logo para tablets verticales */
                min-width: 8rem; /* reduce el ancho minimo del logo */
            }

    }


    /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
    @media (max-width: 576px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                width: 30vw; /* adapta el ancho del logo para dispositivos moviles */
                min-width: 7rem; /* mantiene un ancho minimo para conservar su legibilidad */
                max-height: 60px; /* limita la altura del logo dentro de la cabecera movil */
            }

    }

   /* móviles grandes (iPhone 11, iPhone Plus/Max, Android grandes) */
   @media (max-width: 414px) {

      /* Sin media */

   }

    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                width: 32vw; /* aumenta proporcionalmente el ancho en pantallas mas estrechas */
            }

    }


    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        /* SUBTITULO 1 IMAGEN LOGO CABECERA */

            .imagen_logo_cabecera {
                width: 34vw; /* adapta el ancho del logo para dispositivos pequeños */
                min-width: 6.5rem; /* reduce el ancho minimo para evitar que ocupe demasiado espacio */
            }

    }

/* -------------------------------------------------------------------------------------------------------------
   -------------------------------------- FIN ITred Spa logo_cabecera .CSS -------------------------------------
   ------------------------------------------------------------------------------------------------------------- */


/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/