/* SK-5643 — "Ask about Skrypt in ChatGPT · Claude · Perplexity · Google AI". Markup is stamped by src/stamp-ask-ai.mjs.
   A quiet row at the hero's fine-print size; at ≤640px it folds into one ghost pill that opens a native <details> list. */
.ask-ai { font-size: 12px; line-height: 1.5; }
.ask-ai-row { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; margin: 0; }
.ask-ai-link { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.ask-ai-link:hover { text-decoration-thickness: 2px; }
.ask-ai-link:focus-visible, .ask-ai-menu > summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 3px; }
.ask-ai-mark { flex: none; width: 14px; height: 14px; }
.ask-ai-sep { opacity: .6; }
.ask-ai-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ask-ai-menu { display: none; }
@media (max-width: 640px) {
  .ask-ai-row { display: none; }
  .ask-ai-menu { display: block; }
  .ask-ai-menu > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid #bacfbe; border-radius: 100px; font-size: 13px; font-weight: 600; cursor: pointer; list-style: none; }
  .ask-ai-menu > summary::-webkit-details-marker { display: none; }
  .ask-ai-menu > summary::after { content: ""; width: 6px; height: 6px; margin-left: 10px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s cubic-bezier(.22,1,.36,1); }
  .ask-ai-menu[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
  .ask-ai-list { display: grid; gap: 0; margin-top: 6px; }
  .ask-ai-list .ask-ai-link { min-height: 44px; font-size: 14px; text-decoration: none; }
}
@media (prefers-reduced-motion: reduce) { .ask-ai-menu > summary::after { transition: none; } }

/* Homepage hero (teal, centered): sits beside the HIPAA & PHIPA line, same size and color. */
.home-c .c-hero .ask-ai { display: inline-block; vertical-align: middle; margin: 6px 0 0 14px; color: #d3e9dc; }
.home-c .c-hero .ask-ai-row { justify-content: center; }
.home-c .c-hero .ask-ai-menu > summary { border-color: #ffffff4d; color: var(--c-on, #fff); }
.home-c .c-hero .ask-ai-list { justify-items: center; }
@media (max-width: 640px) { .home-c .c-hero .ask-ai { display: block; margin: 4px 0 0; } }

/* Vertical pages (teal .pg-hero, left-aligned, body copy #c2d8cd) and get-started (teal, centered). */
.pg-hero .ask-ai { margin-top: 20px; color: #c2d8cd; }
.pg-hero .ask-ai-menu > summary { border-color: #ffffff4d; color: #faf7f1; }
.signup-intro .ask-ai { margin-top: 14px; color: #d3e9dc; }
.signup-intro .ask-ai-menu > summary { border-color: #ffffff4d; color: #faf7f1; }
.signup-intro .ask-ai-row { justify-content: center; }
.signup-intro .ask-ai-list { justify-items: center; }

/* /lp (night hero, left-aligned): under the trust line, same 13px and colour as it. */
#hero .hero-copy > .ask-ai { margin-top: 16px; font-size: 13px; color: var(--ns-dim, #8da396); }
#hero .hero-copy > .ask-ai .ask-ai-menu > summary { border-color: var(--ns-line, #223129); color: var(--ns-tx, #e9ede9); }

/* SK-5651: "Prompt copied" note after a tap on a touch device (ask-ai.js). */
.ask-ai-toast { position: fixed; left: 16px; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); z-index: 1000; width: fit-content; margin: 0 auto; padding: 12px 16px; border: 1px solid #ffffff26; border-radius: 12px; background: #093b3b; color: #faf7f1; font-size: 14px; line-height: 1.4; box-shadow: 0 8px 24px #0003; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .2s, transform .2s cubic-bezier(.22,1,.36,1); }
.ask-ai-toast.is-on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ask-ai-toast { transition: none; } }
