/* Scoped to the article CTA; content, spacing and navigation stay in their shared styles. */
.gladia-article-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #171b21;
}
.gladia-article-cta > .kw-article-particles {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
.gladia-article-cta > .kw-article-particles canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.gladia-article-cta > .gladia-article-cta-inner {
  position: relative;
  z-index: 1;
}

/* Shared detail-page actions: installer menu first, AI office second. */
.gladia-article-cta { overflow: visible; }
.gladia-article-cta > .kw-article-particles { overflow: hidden; border-radius: inherit; }
.kw-article-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; margin-top: 24px; }
.kw-article-actions summary.kw-experience-primary,
.gladia-article-cta .kw-article-actions > a.kw-community-secondary {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; margin: 0; padding: 12px 24px; border-radius: 999px;
  font: 500 14px/1.5 var(--kuwork-font-sans); text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease;
}
.kw-article-actions summary.kw-experience-primary { background: #fff; color: #17191c; border: 1px solid #fff; }
.gladia-article-cta .kw-article-actions > a.kw-community-secondary { background: transparent; color: #fff; border: 1px solid #ffffff80; }
.kw-article-actions .kw-download-menu { left: 0; transform: none; }
@media (hover: hover) {
  .kw-article-actions summary.kw-experience-primary:hover { background: #e8e8e8; border-color: #e8e8e8; }
  .gladia-article-cta .kw-article-actions > a.kw-community-secondary:hover { background: #ffffff18; border-color: #fff; }
}
.kw-article-actions :is(summary,a):focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.kw-article-actions .kw-installer:focus-visible { outline-color: #17191c; }
@media (max-width: 600px) {
  .kw-article-actions { flex-direction: column; align-items: stretch; margin-top: 20px; }
  .kw-article-actions .kw-download { width: 100%; }
  .kw-article-actions .kw-download-menu { position: relative; inset: auto; width: min(230px, 100%); margin: 10px auto 0; }
}
@media (prefers-reduced-motion: reduce) {
  .kw-article-actions summary.kw-experience-primary,
  .gladia-article-cta .kw-article-actions > a.kw-community-secondary { transition: none; }
}
