/* The space under a short list (user, 2026-10-26, from the Insiders "My companies" page: "each page … should have some
   version of this"): illustration + heading + one line + buttons, then four shortcut cards, then the page's own Learn more.
   js/aiq-more.js builds it. Nothing is dropped as the list grows — the page scrolls instead (user, 2026-10-31):
     .is-full  illustration + heading + line + buttons + cards (always, when the block has a title)
     .is-foot  cards only (a block built with no title)
   Rules: docs/features/more-block.md. */
.aiq-more { display: flex; flex-direction: column; align-items: center; flex: none; width: 100%; box-sizing: border-box; padding: 0 16px; }
.aiq-more[hidden] { display: none; }
.aiq-more-hero { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; flex: 1 1 auto; text-align: center; padding: 48px 0 32px; }   /* top: the JS sets it so the illustration is 48px under the last row on every page */
.aiq-more.is-foot .aiq-more-hero { display: none; }
.aiq-more.is-foot { padding-top: 24px; }

.aiq-more-art { position: relative; width: 138px; height: 138px; margin-bottom: 16px; flex: none; }
.aiq-more-art svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.aiq-more-art pattern circle { fill: var(--a-check, #D7D9DE); }
.aiq-more-art .plus { fill: none; stroke: var(--a-check, #D7D9DE); stroke-width: 1; }
.aiq-more-art .ring { fill: none; stroke: var(--a-line, #EEEFF1); stroke-width: 6; }
.aiq-more-art .card { fill: var(--a-bg, #fff); stroke: var(--a-check, #D7D9DE); stroke-width: 1.5; }
.aiq-more-art i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 34px; color: var(--a-check, #C9CCD3) !important; }
html[data-theme="dark"] .aiq-more-art pattern circle, html[data-theme="dark"] .aiq-more-art .plus { fill: #4A5060; stroke: #4A5060; }
html[data-theme="dark"] .aiq-more-art .card { stroke: #4A5060; }
html[data-theme="dark"] .aiq-more-art i { color: #5A6172 !important; }

.aiq-more-hero h2:not(#_) { margin: 0 0 8px; font: 600 20px/24px Inter, system-ui, sans-serif !important; color: var(--a-ink, #15171C); letter-spacing: -0.2px; }
.aiq-more-hero p:not(#_) { margin: 0 0 16px; max-width: 340px; color: var(--a-mute, #6B7280); font: 500 14px/20px Inter, system-ui, sans-serif; }
.aiq-more-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.aiq-more-cta .aiq-more-b { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 10px; border: 0; border-radius: 8px; cursor: pointer; text-decoration: none;
  font: 500 14px/20px Inter, system-ui, sans-serif; background: var(--a-bg, #fff); color: var(--a-ink, #15171C); box-shadow: 0 0 0 1px var(--a-ring, #E6E7EA), 0 1px 2px rgba(16,24,40,.04); }
.aiq-more-cta .aiq-more-b:hover { background: var(--a-hover, rgba(0,0,0,.03)); }
.aiq-more-cta .aiq-more-b.pri { background: var(--cs-accent, #455DDC); color: var(--cs-accent-ink, #fff); box-shadow: none; }
.aiq-more-cta .aiq-more-b.pri:hover { background: color-mix(in srgb, var(--cs-accent, #455DDC) 88%, #000); }
.aiq-more-cta .aiq-more-b.pri i { color: inherit !important; }

/* four large buttons: a page's most useful starting points */
.aiq-more-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; width: min(960px, 100%); margin: 8px auto 8px; }
.aiq-more-cards.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(720px, 100%); }
@media (max-width: 1100px) { .aiq-more-cards:not(.n3) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .aiq-more-cards:not(#_) { grid-template-columns: minmax(0, 1fr); } }
.aiq-more-c { display: flex; align-items: center; gap: 12px; height: 72px; padding: 12px 14px 12px 12px; border: 0; border-radius: 12px; cursor: pointer; text-align: left; text-decoration: none;
  background: var(--a-bg, #fff); box-shadow: 0 0 0 1px var(--a-line, #EEEFF1); color: var(--a-ink, #15171C); font: inherit; min-width: 0; }
.aiq-more-c:hover { background: var(--a-hover, rgba(0,0,0,.02)); box-shadow: 0 0 0 1px var(--a-ring, #E6E7EA); }
.aiq-more-c .ic { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; flex: none; background: var(--tb); color: var(--tn); }
.aiq-more-c .ic i { font-size: 19px; color: var(--tn) !important; }
.aiq-more-c .tx { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.aiq-more-c .tx b { font: 600 14px/20px Inter, system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aiq-more-c .tx small { font: 500 12px/16px Inter, system-ui, sans-serif; color: var(--a-mute, #8792A6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aiq-more-c .go { color: var(--a-faint, #C4C7CE); font-size: 14px; flex: none; }
.aiq-more-c:hover .go { color: var(--a-ink, #15171C); }
.aiq-more .t-blue   { --tn: #3550D0; --tb: rgba(69,93,220,.10); }
.aiq-more .t-green  { --tn: #12946B; --tb: rgba(67,209,167,.14); }
.aiq-more .t-violet { --tn: #7B2FD6; --tb: rgba(150,70,239,.10); }
.aiq-more .t-orange { --tn: #C25A0C; --tb: rgba(255,134,46,.13); }
.aiq-more .t-rose   { --tn: #C8203F; --tb: rgba(247,52,99,.10); }
.aiq-more .t-teal   { --tn: #0E8A8A; --tb: rgba(20,184,166,.12); }
html[data-theme="dark"] .aiq-more .t-blue   { --tn: #8EA0F0; --tb: rgba(69,93,220,.22); }
html[data-theme="dark"] .aiq-more .t-green  { --tn: #43D1A7; --tb: rgba(67,209,167,.14); }
html[data-theme="dark"] .aiq-more .t-violet { --tn: #B98CF6; --tb: rgba(150,70,239,.18); }
html[data-theme="dark"] .aiq-more .t-orange { --tn: #FF9F5A; --tb: rgba(255,134,46,.15); }
html[data-theme="dark"] .aiq-more .t-rose   { --tn: #FF7A98; --tb: rgba(247,52,99,.16); }
html[data-theme="dark"] .aiq-more .t-teal   { --tn: #5ED6D0; --tb: rgba(20,184,166,.16); }