@charset "utf-8";
@import url("/css/ospeca-calido.css");
/* =====================================================================
   O.S.Pe.C.A. — variante "Azul y Blanca"

   Por que: OSPECA pertenece a la Lista Azul y Blanca, y los colores del
   sitio deben reflejarlo. No es un color impuesto desde afuera: el aro del
   emblema (logos/emblema.png) ya es celeste y blanco. La variante calida
   habia llevado el acento a terracota por la fachada de la sede; esta
   vuelve a la marca.

   Como: importa la variante calida y reemplaza solamente fichas de color y
   el degradado del encabezado. La forma (radio 14px, botones pildora), la
   tipografia Libre Franklin, la escala, las rejillas, el acordeon, el pie y
   la accesibilidad se heredan intactos. No hace falta tocar HTML salvo el
   <link> de cada pagina; volver atras es enlazar otra vez ospeca-calido.css.

   Se conservan los NOMBRES de las fichas (--cian, --cian-vivo...) para no
   reescribir reglas del sistema ni de la cartilla: --cian vuelve a ser azul,
   que es lo que su nombre siempre dijo.

   Gama completa, de oscuro a claro, cada tono con un unico trabajo:
     azul noche    --tinta                      texto, barra superior y pie
     azul lista    --cian                       enlaces, botones, menu activo, cifras
     azul hondo    --cian-hondo                 hover y la marca
     azul aro      --cian-vivo                  bordes, reglas y la palabra de color en titulos
     celeste papel --cian-tenue / --papel-hondo superficies
     blanco        --blanco / --papel           fondos

   Verde, ambar y rojo se mantienen solo como SEMANTICA (vigente, advertencia,
   urgencia): si se tiñeran de azul dejarian de significar algo.

   Historia de la decision: una primera version agregaba una banda de franjas
   celestes y blancas, citando el aro, al pie de la barra superior y al
   comienzo del pie. Se retiro tras la revision visual del responsable del
   sitio el 14/09/2026: se leia como una linea punteada y no aportaba a la
   lectura. El marco queda en azul noche liso.

   Contraste medido con ops/scripts/contraste-fichas.py: tabla al pie.
   ===================================================================== */

:root {
  /* --- color ------------------------------------------------------- */
  --tinta:          #0b1f3a;   /* azul noche */
  --tinta-media:    #34495f;
  --tinta-suave:    #4a5c72;
  --tinta-clara:    #b9cbe2;   /* texto atenuado sobre el pie */

  --papel:          #f7faff;   /* blanco con un soplo de celeste */
  --papel-hondo:    #e8f1fb;   /* bandas, tarjetas y zonas hundidas */
  --blanco:         #ffffff;

  --cian:           #1b4f9c;   /* azul de la lista: enlaces y botones */
  --cian-vivo:      #3a86d6;   /* azul del aro: bordes y titulos grandes */
  --cian-hondo:     #11386f;   /* hover y marca */
  --cian-tenue:     #dfebf9;   /* superficie tenue y anillo de foco oscuro */

  --savia:          #2b6a47;   /* semantica: vigente, abierto */
  --savia-tenue:    #e4f0e8;

  --sol:            #87590e;   /* semantica: advertencia */
  --sol-tenue:      #fbf1dc;

  --urgencia:       #b3301c;   /* semantica: solo urgencias y errores */
  --urgencia-tenue: #fbeae6;

  --linea:          #d0deee;
  --linea-suave:    #e4edf7;
}

/* =====================================================================
   ENCABEZADO BLANCO Y CELESTE
   La variante calida mezclaba terracota tenue con verde. Aca el degradado va
   de celeste papel a blanco: los dos colores de la lista, sin un tercero.
   La regla inferior pasa al azul de la lista para cerrar el encabezado con
   el mismo tono del menu activo.
   ===================================================================== */

#header {
  background: linear-gradient(115deg, var(--cian-tenue), var(--blanco) 70%);
  border-bottom-color: var(--cian);
}

/* =====================================================================
   CONTRASTE MEDIDO (WCAG 2.x, ops/scripts/contraste-fichas.py)

     --tinta         sobre --papel         15.79:1   AAA
     --tinta         sobre --papel-hondo   14.48:1   AAA
     --tinta-media   sobre --papel          8.87:1   AAA
     --tinta-media   sobre --papel-hondo    8.13:1   AAA
     --tinta-suave   sobre --papel          6.55:1   AA
     --tinta-suave   sobre --papel-hondo    6.01:1   AA
     --cian          sobre --papel          7.59:1   AAA   enlaces
     --cian          sobre --papel-hondo    6.96:1   AA
     --cian          sobre --cian-tenue     6.57:1   AA    tarjeta en hover
     --blanco        sobre --cian           7.94:1   AAA   botones y menu activo
     --cian-hondo    sobre --papel         11.03:1   AAA   hover
     --cian-vivo     sobre --papel          3.61:1   solo bordes y titulos >= 24px
     --cian-vivo     sobre --blanco         3.78:1   componentes de interfaz
     --tinta-clara   sobre --tinta          9.99:1   texto atenuado del pie
     --cian-tenue    sobre --tinta         13.68:1   enlaces y foco en el pie
     --savia         sobre --savia-tenue    5.51:1   AA
     --sol           sobre --sol-tenue      5.40:1   AA
     --urgencia      sobre --urgencia-tenue 5.37:1   AA
   ===================================================================== */
