/* Bloque «Parte de AvilesIA» + barra flotante (va con js/avilesia.js). Genérico: cada app ajusta
   los colores con estas variables. Valores de asturGuÍA: verde bosque, crema y naranja. */
:root {
  --avi-fondo: rgba(241, 239, 236, .06);
  --avi-borde: rgba(241, 239, 236, .28);
  --avi-texto: #F1EFEC;
  --avi-suave: #B1B886;
  --avi-tarjeta: #F1EFEC;
  --avi-tarjeta-texto: #1D1917;
  --avi-tarjeta-cat: #2F5F82;
  --avi-acento: #FC6220;
  --avi-acento-texto: #1D1917;
  --avi-marca: #FF7A3D;
  --avi-cristal: rgba(29, 25, 23, .74);
  --avi-letra: system-ui, sans-serif;
  --avi-titulos: system-ui, sans-serif;
}

/* ---------- Bloque ---------- */
.avi-bloque { margin: 40px 0 8px; padding: 22px 20px 20px; border: 1px solid var(--avi-borde); border-radius: 22px;
  background: var(--avi-fondo); color: var(--avi-texto); font-family: var(--avi-letra); }
.avi-eyebrow { margin: 0; color: var(--avi-suave); font: 600 .72rem/1.2 var(--avi-letra); letter-spacing: .16em; text-transform: uppercase; }
.avi-titulo { margin: 6px 0 0; font: 600 clamp(1.35rem, 5.4vw, 1.9rem)/1.1 var(--avi-titulos); letter-spacing: -.04em; }
.avi-apps { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 720px) { .avi-apps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.avi-app { display: flex; flex-direction: column; height: 100%; min-height: 44px; padding: 14px; border-radius: 16px; text-decoration: none;
  background: var(--avi-tarjeta); color: var(--avi-tarjeta-texto); transition: transform .25s, background-color .25s; }
.avi-app:hover, .avi-app:focus-visible { transform: translateY(-2px); background: var(--avi-acento); color: var(--avi-acento-texto); }
.avi-app-cat { font: 700 .66rem/1.2 var(--avi-letra); letter-spacing: .12em; text-transform: uppercase; color: var(--avi-tarjeta-cat); }
.avi-app:hover .avi-app-cat, .avi-app:focus-visible .avi-app-cat { color: inherit; }
.avi-app-nombre { margin-top: 6px; font: 700 1.08rem/1.15 var(--avi-titulos); letter-spacing: -.02em; overflow-wrap: anywhere; }
.avi-app-desc { margin-top: 4px; font-size: .84rem; line-height: 1.35; opacity: .78; }
.avi-ver { display: flex; justify-content: center; align-items: center; min-height: 48px; margin-top: 16px; padding: 10px 20px; border-radius: 999px;
  background: var(--avi-acento); color: var(--avi-acento-texto); font-weight: 700; text-decoration: none; }
.avi-ver:hover { filter: brightness(1.08); }
@media (min-width: 720px) { .avi-ver { display: inline-flex; } }

/* ---------- Barra flotante (cristal) ---------- */
.avi-barra { position: fixed; inset-inline: 0; bottom: 0; z-index: 1400; display: flex; justify-content: center; padding: 0 12px calc(12px + env(safe-area-inset-bottom));
  pointer-events: none; transition: transform .3s cubic-bezier(.22,.8,.2,1); font-family: var(--avi-letra); }
.avi-barra.avi-oculta { transform: translateY(calc(100% + 16px)); }
.avi-cristal { pointer-events: auto; display: flex; align-items: center; gap: 2px; max-width: 100%; padding: 6px 6px 6px 16px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16); background: var(--avi-cristal); color: #fff; box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
  -webkit-backdrop-filter: blur(12px) saturate(1.3); backdrop-filter: blur(12px) saturate(1.3); }
[dir="rtl"] .avi-cristal { padding: 6px 16px 6px 6px; }
.avi-marca { margin-inline-end: 6px; color: var(--avi-marca); font: 800 .95rem/1 var(--avi-titulos); letter-spacing: -.02em; text-decoration: none; white-space: nowrap; }
.avi-enlace { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 40px; height: 40px; padding: 0 9px; border-radius: 999px;
  color: #fff; text-decoration: none; font-size: .86rem; font-weight: 600; white-space: nowrap; }
.avi-enlace:hover, .avi-enlace:focus-visible, .avi-cerrar:hover, .avi-cerrar:focus-visible { background: rgba(255, 255, 255, .12); }
.avi-icono { font-size: 1.05rem; line-height: 1; }
.avi-etiqueta { display: none; }
@media (min-width: 720px) { .avi-etiqueta { display: inline; } .avi-cristal { gap: 4px; } }
.avi-cerrar { flex: none; width: 40px; height: 40px; margin-inline-start: 2px; border: 0; border-radius: 999px; background: transparent; color: rgba(255, 255, 255, .75); font-size: 1rem; line-height: 1; }
.avi-cerrar:hover { color: #fff; }
/* Hueco abajo mientras la barra está activa, para que no tape el final de la página */
html[data-avilesia-barra] body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
@media (prefers-reduced-motion: reduce) { .avi-barra, .avi-app { transition: none; } }