@import url('https://fonts.googleapis.com/css?family=Fredoka+One');
@import url('menu.css');
@import url('banner.css');
@import url('blog.css');
@import url('info.css');
@import url('Consultas.css');
@import url('Somos.css');
*
{
	margin:0;
	padding:0;
	box-sizing:border-box;
}


.float
{
    position: fixed;
    width: 60px;
    height: 60px;
    background-color: #25d366;
    bottom: 40px;
    right: 40px;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
    z-index: 999;
}

.fa-whatsapp
{
    font-size: 60px;
}

.float:hover
{
    background-color: #28e76e;
}



body
{
	font-family:Verdana, Geneva, Tahoma, sans-serif, cursive;
}

header
{
	border-bottom: 1px solid #e0e0e0; /* Línea gris muy suave */
    padding-bottom: 15px;             /* Espacio entre el texto y la línea */
    margin-bottom: 20px;             /* Espacio después de la línea para el contenido */
	font-family: Brush Script MT;
	font-size: 23pt;
	width:100%;
	height:80px;
	background:#c8c8ee;
	color:#0a0a0a;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
}

Cuerpo
{
    width:100%;
    height:90%;    
}


.contenedor
{
	width: 90%;           /* Ocupa el 90% del ancho de la pantalla */
    max-width: 1200px;    /* No se estira más de 1200px en monitores grandes */
    margin: 0 auto;       /* Centra el contenedor horizontalmente */
    padding: 10px 0;      /* Espacio extra arriba y abajo por estética */
}

.Experiencia
{
	float: right;
	font-size: 0.9rem;
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	vertical-align:top;
	color: rgb(9, 3, 97);
	white-space: nowrap;
}

h1 
{
	float:left;
}

h5
{
	float:right;
	font-size: 15px;
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	vertical-align:top;
	color: rgb(9, 3, 97);
}


.fila-principal {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    gap: 15px;
}


.datos-personales {
    /* Esto evita que este bloque se achique (shrink) más de la cuenta */
    flex-shrink: 0; 
}

.datos-personales p, 


.Experiencia {
    font-size: 0.9rem;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: rgb(9, 3, 97);
    white-space: nowrap;
    /* Esto le dice que si no hay espacio, se achique ella y no el nombre */
    flex-shrink: 1; 
}

.datos-personales h2 {
 	font-size: 2.2rem; /* Tamaño fijo pero cómodo */
}

header .contenedor
{
	display:table;
}

section
{
	width:100%;
	margin-bottom:20px;
	margin-top: 100px;
}

#bienvenidos
{
	text-align:center;
}

#Contactos
{
    text-align: center;
}

footer .contenedor
{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	text-align: center;
	background-color: #ffffff;
}


.copy
{
	font-size:20px;
}

.sociales
{
	width:100%;
	text-align:center;
	vertical-align: middle;
	font-size:28px;
}

@media (min-width:768px)
{
	.sociales
	{
		width:auto;
	}
	
	footer .contenedor
	{
		justify-content:space-between;
	}
}

@media (max-width: 600px) {
    .fila-principal {
        flex-wrap: wrap; /* Permite que la experiencia baje si no hay espacio */
    }
    
    .Experiencia {
        white-space: normal; /* Permite que el texto se divida en dos renglones si es necesario */
        text-align: right;   /* Mantiene la alineación a la derecha */
        width: 100%;        /* Al bajar, ocupa todo el ancho */
    }
}

/* Ajuste específico para que el contenido no toque los bordes en móviles */
@media (max-width: 480px) {
    .contenedor {
        width: 94%;       /* En móviles le damos un poquito más de espacio */
    }
}

@media (max-width: 480px) {
    .datos-personales h2 {
        font-size: 1.2rem; /* Achica el nombre */
    }

    .datos-personales p{
        font-size: 0.85rem;
    }

    .experiencia {
        font-size: 0.75rem; /* Achica los textos secundarios */
    }
	.fila-principal {
        gap: 5px; /* Reduce el espacio entre bloques para ganar lugar */
    }
}