/* =====================================================================
   RV25 Relojería · UTILIDADES
   ---------------------------------------------------------------------
   Clases pequeñas que se pueden usar en cualquier parte.
   ===================================================================== */

/* Lo que tiene el atributo hidden NUNCA se ve, aunque otra regla le dé
   display (por ejemplo "svg { display: block }" en base.css). */
[hidden] { display: none !important; }

/* Texto que solo leen los lectores de pantalla */
.oculto {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Enlace "Saltar al catálogo": aparece solo al usar el teclado */
.saltar {
  position: absolute; left: -999px; top: 8px; z-index: 50;
  padding: 10px 14px;
  background: var(--noche); color: var(--fondo);
}
.saltar:focus { left: 8px; }

/* Ícono SVG del bloque ICONOS de index.html: toma el color del texto */
.icono { display: block; width: 24px; height: 24px; flex: none; }
/* Ajuste óptico: unos íconos se ven más pequeños o más grandes que otros */
.icono-grande { width: 28px; height: 28px; }
.icono-chico  { width: 21px; height: 21px; }

/* Caja de aviso simple (por ejemplo, si no hay JavaScript) */
.aviso { padding: 20px; background: var(--arena); }