/* ============================================================================
   DF A11Y WCAG 2.2 AAA — Foco Neón corporativo, Skip Link y Screen-Reader Only
   LEY 4: Dark-Tech (#0A0A0A / #00FF00). Animaciones solo opacity/transform.
   ========================================================================== */

/* Foco visible: anillo neón corporativo en TODO elemento focalizable */
:focus-visible {
	outline: 2px solid #00FF00 !important;
	outline-offset: 3px !important;
	box-shadow: 0 0 14px rgba(0, 255, 0, 0.45) !important;
}

/* El foco solo de ratón queda limpio (heurística nativa del navegador) */
:focus:not(:focus-visible) {
	outline: none;
}

/* Skip Link WCAG 2.4.1 — Bypass Blocks */
.df-skip-link {
	position: absolute;
	top: -9999px;
	left: 1rem;
	z-index: 999999;
	background: #0A0A0A;
	color: #00FF00;
	border: 2px solid #00FF00;
	padding: 0.75rem 1.5rem;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: 4px;
	box-shadow: 0 0 20px rgba(0, 255, 0, 0.4);
	text-decoration: none;
	transition: top 0.2s ease-out;
}

.df-skip-link:focus-visible {
	top: 1rem;
}

/* Screen-Reader Only: contenido accesible invisible al render visual */
.df-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	.df-skip-link {
		transition: none !important;
	}
}