/* "Ask AI about us": five engines, each opened with a prompt about lilAgents.
   Carried over from the production footer because it is a live AEO surface,
   not decoration. Sits under the social row and borrows its treatment so the
   two read as one block rather than a bolt-on.

   The icons arrive as supplied brand marks, and most of them are dark: the
   OpenAI, Gemini and Grok glyphs are near-black, so on this footer they were
   invisible. They are flattened to white and dimmed, the same thing the
   production footer does with a longer filter chain. Flattening loses Claude's
   orange, which is the right trade: five marks in five different colours sat
   beside four white social icons reads as clutter, and the row is a set of
   links rather than a logo wall. */
.la-askai { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.la-askai-holder { display: flex; align-items: center; gap: 8px; }
.la-askai-link {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .18);
  transition: background-color .18s ease, border-color .18s ease;
}
.la-askai-link:hover { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .38); }
.la-askai-icon {
  width: 18px; height: 18px; object-fit: contain; display: block;
  filter: brightness(0) invert(1);
  opacity: .68; transition: opacity .18s ease;
}
.la-askai-link:hover .la-askai-icon { opacity: 1; }

@media (max-width: 560px) {
  .la-askai { margin-top: 14px; }
  .la-askai-link { width: 34px; height: 34px; }
}