/* Shared "Explore every feature" band, injected by scripts/build-feature-atlas.mjs
   onto app pages, built-in feature pages, and the homepage. The right side previews
   a few real features, headline first. */
.atlas-cta-band { padding: clamp(40px, 6vw, 80px) 0; }
.atlas-cta {
  position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: clamp(28px, 4vw, 64px);
  padding: clamp(28px, 4.5vw, 64px); overflow: hidden; border-radius: 32px; color: #fff; isolation: isolate;
  background:
    radial-gradient(70% 90% at 100% 0%, rgba(197, 176, 244, 0.38), transparent 60%),
    radial-gradient(60% 80% at 0% 100%, rgba(220, 238, 177, 0.2), transparent 65%),
    linear-gradient(155deg, #221f45, #15132b 70%);
}
.atlas-cta::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0.22;
  background-image: linear-gradient(rgba(255, 255, 255, 0.14) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.14) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(80% 90% at 70% 40%, #000 20%, transparent 75%);
}
.atlas-cta-kicker {
  display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px;
  color: #dceeb1; font-family: "Geist Mono", monospace; font-size: 12px; font-weight: 580; letter-spacing: 0.14em; text-transform: uppercase;
}
.atlas-cta-kicker span { width: 9px; height: 9px; border-radius: 50%; background: #dceeb1; box-shadow: 0 0 0 4px rgba(220, 238, 177, 0.18); }
.atlas-cta h2 { margin: 0; color: #fff; font-size: clamp(30px, 3.6vw, 50px); font-weight: 400; letter-spacing: -0.04em; line-height: 1.04; text-wrap: balance; }
.atlas-cta h2 em { color: #c5b0f4; font-style: normal; }
.atlas-cta-copy > p { max-width: 46ch; margin: 18px 0 0; color: rgba(255, 255, 255, 0.76); font-size: clamp(16px, 1.3vw, 18px); line-height: 1.55; }
.atlas-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 28px; }
.atlas-cta-actions .button { border-color: #fff; background: #fff; color: #15132b; }
.atlas-cta-actions .button span { transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1); }
.atlas-cta-actions .button:hover span { transform: translateX(4px); }
.atlas-cta:not(:has(.atlas-cta-peek)) { grid-template-columns: 1fr; }
.atlas-cta-peek { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.atlas-cta-peek a {
  display: grid; gap: 6px; padding: 18px 20px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 18px;
  background: rgba(255, 255, 255, 0.05); color: #fff; text-decoration: none; backdrop-filter: blur(6px);
  transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), background-color 300ms ease, border-color 300ms ease;
}
.atlas-cta-peek li:nth-child(1) a { border-left: 3px solid #dceeb1; }
.atlas-cta-peek li:nth-child(2) a { border-left: 3px solid #c5b0f4; }
.atlas-cta-peek li:nth-child(3) a { border-left: 3px solid #fff; }
.atlas-cta-peek a:hover { transform: translateX(6px); border-color: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.09); }
.atlas-cta-peek small { color: rgba(255, 255, 255, 0.6); font-family: "Geist Mono", monospace; font-size: 11.5px; font-weight: 560; letter-spacing: 0.08em; text-transform: uppercase; }
.atlas-cta-peek b { font-size: clamp(17px, 1.5vw, 20px); font-weight: 520; letter-spacing: -0.015em; line-height: 1.3; }
.atlas-cta-actions small { color: rgba(255, 255, 255, 0.6); font-family: "Geist Mono", monospace; font-size: 12px; letter-spacing: 0.04em; }
@media (max-width: 900px) {
  .atlas-cta { grid-template-columns: 1fr; border-radius: 26px; }
}
@media (max-width: 480px) {
  .atlas-cta { padding: 26px 20px 28px; border-radius: 22px; }
  .atlas-cta-actions .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .atlas-cta-peek a, .atlas-cta-actions .button span { transition: none; }
}
/* Page stylesheets style bare paragraphs; keep the band identical everywhere. */
.atlas-cta-band .atlas-cta p.atlas-cta-kicker { margin: 0 0 18px; font-size: 12px; line-height: 1.3; letter-spacing: 0.14em; }
.atlas-cta-band .atlas-cta .atlas-cta-copy > p:not(.atlas-cta-kicker) { max-width: 46ch; margin: 18px 0 0; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.55; }
.atlas-cta-band .atlas-cta h2 { margin: 0; font-size: clamp(30px, 3.6vw, 50px); line-height: 1.04; }