/* 🎨 Iconos locales (sprite en img/iconos.svg).
   Sustituye a FontAwesome servido desde CDN.

   ⚠️ El ancho va declarado a mano, y es a propósito: el <svg> que lleva el
   <use> NO tiene viewBox propio (el viewBox vive en el <symbol> del sprite), así
   que el navegador no le conoce proporción intrínseca. Con `width: auto` cae al
   ancho por defecto de un elemento reemplazado, 300px, y cada icono empujaba el
   texto de al lado (la web entera salía descuadrada). Con 1em × 1em el símbolo
   se escala con preserveAspectRatio (xMidYMid meet), conservando su proporción
   dentro de una caja cuadrada, igual que hacía el glifo de la fuente.

   Reglas equivalentes a las del kit SVG oficial de FontAwesome:
   - 1em de alto → sigue respondiendo a font-size (.error-icon { font-size: 5rem });
   - fill: currentColor → hereda el color del texto, igual que el glifo;
   - vertical-align: -.125em, el mismo ajuste óptico del kit oficial.

   La clase `fa-<nombre>` se mantiene en el elemento para que las reglas del
   sitio que dan color a un icono concreto (.fa-check, .fa-circle-xmark…)
   sigan funcionando. */
.ico {
    display: inline-block;
    width: 1em;
    height: 1em;
    overflow: visible;
    vertical-align: -0.125em;
    fill: currentColor;
    flex-shrink: 0;
}