/* =================================================================
   SEO Fixes - Clases para optimización SEO
   ================================================================= */

/* Screen Reader Only - Técnica estándar de accesibilidad
   Oculta visualmente el elemento pero lo mantiene accesible para:
   - Motores de búsqueda (Google, Bing, etc.)
   - Lectores de pantalla
   - Tecnologías de asistencia
   
   Esta técnica NO usa display:none ni visibility:hidden, por lo que:
   ✓ Google lo indexa correctamente
   ✓ No hay penalización SEO
   ✓ Cumple con WCAG 2.1 (accesibilidad)
   
   Usado por: Bootstrap, WordPress, GitHub, GOV.UK
*/
/* Regla específica para h1 con clase sr-only - Máxima especificidad */
h1.sr-only,
h2.sr-only,
h3.sr-only,
h4.sr-only,
h5.sr-only,
h6.sr-only {
	color: transparent !important;
	background: transparent !important;
	position: absolute !important;
	width: 1px !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* Regla general para cualquier elemento con clase sr-only */
.sr-only {
	color: transparent !important;
	background: transparent !important;
	position: absolute !important;
	width: 1px !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* Variante enfocable - Permite que elementos .sr-only sean visibles cuando reciben focus
   Útil para enlaces de "saltar al contenido principal" */
.sr-only-focusable:active,
.sr-only-focusable:focus {
	position: static;
	width: auto;
	height: auto;
	overflow: visible;
	clip: auto;
	white-space: normal;
}

/* ================================================================
   Sobrescritura de .hidden para SEO
   ================================================================
   La clase .hidden original usa display:none que es penalizada por Google.
   Esta sobrescritura usa técnicas seguras con color transparent.
*/
h1.hidden,
h2.hidden,
h3.hidden,
h4.hidden,
h5.hidden,
h6.hidden {
	color: transparent !important;
	background: transparent !important;
	position: absolute !important;
	width: 1px !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}