.top-social {
	    float: right; 		/* Mantiene la posición a la derecha */
	    margin-top: 35px; 	/* Ajusta según la altura de tu logo - la altura de tu header */
	    display: flex;
	    gap: 10px; 			/* Espacio entre botones */
	}

	.social-icon-top {
		display: flex;
		align-items: center;     	/* Centrado vertical (en ves de: align-content: center;) */
		justify-content: center;  	/* Centrado horizontal */

		width: 55px;				/* Tamaño del círculo */
		height: 55px;				/* Tamaño del círculo */
		border-radius: 50%;			/* Esto lo hace redondo */
		background-color: #999;		/* Color de fondo por defecto */

	    text-decoration: none;
	    font-size: 30px; 			/* Tamaño del icono */
	    color: white;      			/* Color del icono */
	    transition: all 0.3s ease;
	}



	/* Colores de marca al pasar el mouse */
	.social-icon-top.facebook:hover { background-color: #1877F2; }
	.social-icon-top.instagram:hover { background-color: #E4405F; }
	.social-icon-top.tiktok:hover { background-color: #000000; }
	.social-icon-top.youtube:hover { background-color: #FF0000; }

	/* Efecto de elevación - Color a pasar el mouse */
	.social-icon-top:hover {
	    transform: translateY(-3px); /* efecto salto arriba */
	    box-shadow: 0px 4px 10px rgba(0,0,0,0.2);
	}		


	/* -------- en modal poupad--------- */


	.modal-social {
	    float: none; 		/* Mantiene la posición a la derecha */
	    margin: 0 auto; 	/* Ajusta según la altura de tu logo - la altura de tu header */
	    display: flex;
	    gap: 30px; 			/* Espacio entre botones */
	    justify-content: center;
	    /*flex-wrap: nowrap;*/
	}

	.social-icon-modal {
		display: flex;
		align-items: center;     	/* Centrado vertical (en ves de: align-content: center;) */
		justify-content: center;  	/* Centrado horizontal */

		width: 50px;				/* Tamaño del círculo */
		height: 50px;				/* Tamaño del círculo */
		border-radius: 50%;			/* Esto lo hace redondo */
		background-color: #555;		/* Color de fondo por defecto */

	    text-decoration: none;
	    font-size: 28px; 			/* Tamaño del icono */
	    color: white;      			/* Color del icono */
	    transition: all 0.3s ease;
	}



	/* Colores de marca al pasar el mouse */
	.social-icon-modal.facebook:hover { background-color: #1877F2; }
	.social-icon-modal.instagram:hover { background-color: #E4405F; }
	.social-icon-modal.tiktok:hover { background-color: #000000; }
	.social-icon-modal.youtube:hover { background-color: #FF0000; }

	/* Efecto de elevación - Color a pasar el mouse */
	.social-icon-modal:hover {
	    transform: translateY(-3px); /* efecto salto arriba */
	    box-shadow: 0px 4px 10px rgba(0,0,0,0.2);
	}