/** INICIO Navegación entre proyectos DESKTOP**/
		
			#portfolio-navigation {
				position: absolute;
				top: 32px;
				right: 28px;
				z-index: 30;

				display: flex;
				align-items: center;
				gap: 12px;

				margin: 0;
				padding: 0;

				background: transparent;
				border: 0;
			}

			#portfolio-navigation a {
				display: flex;
				align-items: center;
				justify-content: center;

				width: 22px;
				height: 22px;

				margin: 0;
				padding: 0;

				color: #fff;
				background: transparent;
				border: 0;

				font-size: 19px;
				line-height: 1;
				text-decoration: none;

				
				/* Mantiene el icono visible sobre fondos claros */
				text-shadow:
					0 1px 2px rgba(0, 0, 0, 0.75),
					0 0 3px rgba(0, 0, 0, 0.35);

				opacity: 0.95;

				transition:
					opacity 0.2s ease,
					transform 0.2s ease;
			}

			#portfolio-navigation a:hover {
				color: #fff;
				background: transparent;
				opacity: 0.65;
				transform: translateY(-1px);
			}

			#portfolio-navigation i {
				display: block;
				margin: 0;
				padding: 0;

				color: inherit;
				font-size: inherit;
				line-height: 1;

				background: transparent;
				border: 0;
			}

			#portfolio-navigation a:first-child i,
			#portfolio-navigation a:last-child i {
				transform: translateY(5px);
			}

			/* Tablet y móvil */
			@media (max-width: 991px) {

				#portfolio-navigation {
					top: 22px;
					right: 18px;
					gap: 10px;
				}

				#portfolio-navigation a {
					width: 21px;
					height: 21px;
					font-size: 18px;
				}

			}

		/** FIN Navegación entre proyectos DESKTOP **/

		/** INICIO Navegación entre proyectos MOVIL **/
			
		/* Navegación de proyectos móvil: oculta en escritorio */
			#portfolio-navigation-mobile {
				display: none;
			}


			@media only screen and (max-width: 991px) {

				/* Navegación de escritorio */
				#portfolio-navigation {
					display: none !important;
				}


				/* Navegación móvil */
				#portfolio-navigation-mobile {
					display: flex !important;
					width: 100%;
					height: 34px;

					align-items: center;
					justify-content: flex-end;
					gap: 12px;

					padding: 0 15px;
					margin: -5px 0 5px 0;

					position: relative !important;
					top: auto !important;
					right: auto !important;
					left: auto !important;

					z-index: 10;

					background: transparent !important;
					border: 0 !important;

					box-sizing: border-box;
				}


				#portfolio-navigation-mobile a {
					display: flex !important;
					align-items: center;
					justify-content: center;

					width: 22px;
					height: 22px;

					margin: 0;
					padding: 0;

					color: #555 !important;
					background: transparent !important;
					border: 0 !important;

					font-size: 19px;
					line-height: 1;
					text-decoration: none;
				}


				#portfolio-navigation-mobile i {
					display: block !important;
					margin: 0 !important;
					padding: 0 !important;

					color: #555 !important;
					font-size: 19px !important;
					line-height: 1 !important;
				}


				/* Corrección óptica de las flechas */
				#portfolio-navigation-mobile a:first-child i,
				#portfolio-navigation-mobile a:last-child i {
					transform: translateY(2px);
				}

			}

		/** FIN Navegación entre proyectos MOVIL **/
				
	
/* Foco de teclado y superficie táctil sin cambiar el tamaño de los iconos. */
#portfolio-navigation a:focus-visible, #portfolio-navigation-mobile a:focus-visible {
 outline: 2px solid #a51326; outline-offset: 3px;
}
@media (max-width: 991px) {
 #portfolio-navigation-mobile { height: 44px; }
 #portfolio-navigation-mobile a { width: 44px; height: 44px; }
}