/* Agent Builder landing page */

.abl-grad {
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.abl-grad-a { background-image: linear-gradient(90deg, #FFFFFF 0%, #C9A6F5 100%); }
.abl-grad-b { background-image: linear-gradient(90deg, #B78BF0 0%, #9436EB 100%); }
.abl-accent { color: #FFFFFF; -webkit-text-fill-color: #FFFFFF; }

.abl-accent::before {
  content: '';
  position: absolute;
  left: -6%;
  top: 6%;
  width: 112%;
  height: 88%;
  z-index: -1;
  border-radius: 999px;
  background: rgba(147, 52, 235, 0.5);
  filter: blur(16px);
  transform: rotate(-2.5deg);
}

.abl-map-grid {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='55.08' height='34.4'%3E%3Crect width='45.4' height='24.33' rx='12.17' fill='%23FCFCFC'/%3E%3C/svg%3E");
  background-position: center;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 92%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 92%, transparent 100%);
}
.dark .abl-map-grid {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='55.08' height='34.4'%3E%3Crect width='45.4' height='24.33' rx='12.17' fill='%23121014' fill-opacity='0.6'/%3E%3C/svg%3E");
}

.abl-faq-icon {
  background: #FFFFFF;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}
.dark .abl-faq-icon {
  background: radial-gradient(50% 50% at 50% 50%, rgba(106, 106, 106, 0.4) 0%, rgba(43, 43, 43, 0.4) 100%);
  box-shadow: inset 0 4px 16px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(2px);
}
.abl-faq-icon::before,
.abl-faq-icon::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 1.75px;
  margin: -0.875px 0 0 -7px;
  border-radius: 2px;
  background: #6B7280;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.dark .abl-faq-icon::before,
.dark .abl-faq-icon::after { background: #b6b6b6; }
.abl-faq-icon::after { transform: rotate(90deg); }
.abl-faq-toggle[aria-expanded='true'] .abl-faq-icon::after {
  transform: rotate(90deg) scaleX(0);
  opacity: 0;
}

.abl-rail { scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.abl-rail::-webkit-scrollbar { display: none; }

.abl-rail-inset {
  --abl-gutter: 0.75rem;
  padding-left: max(var(--abl-gutter), calc((100% - 1440px) / 2 + var(--abl-gutter)));
  scroll-padding-left: max(var(--abl-gutter), calc((100% - 1440px) / 2 + var(--abl-gutter)));
}
@media (min-width: 640px) { .abl-rail-inset { --abl-gutter: 1rem; } }
@media (min-width: 1024px) { .abl-rail-inset { --abl-gutter: 1.5rem; } }

.abl-number { -moz-appearance: textfield; }
.abl-number::-webkit-outer-spin-button,
.abl-number::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .abl-faq-icon::before,
  .abl-faq-icon::after { transition: none; }
}

#abl-chart-dot { transition: left 0.3s ease-out, top 0.3s ease-out; }
@media (prefers-reduced-motion: reduce) { #abl-chart-dot { transition: none; } }
