/**
 * ASFB CTA — AgentSam Frost Blue
 * Global primary action (Open Workbench, Ask Agent Sam, promo CTAs).
 *
 * Usage:
 *   <a class="asbd-cta-asfb" href="...">Open Workbench</a>
 *   <button type="button" class="asbd-cta-asfb">Ask Agent Sam</button>
 *   <a class="asbd-cta-asfb asbd-cta-asfb--sm" ...>  (compact header)
 */
.asbd-cta-asfb {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: var(--asfb-height, 48px);
  padding: 0 22px;
  border-radius: var(--asfb-radius, 12px);
  border: 1px solid var(--asfb-border, rgba(255, 255, 255, 0.55));
  font-family: var(--asbd-font-sans, inherit);
  font-size: var(--asfb-font-size, 16px);
  font-weight: var(--asfb-font-weight, 700);
  letter-spacing: -0.015em;
  line-height: 1;
  color: var(--asfb-on, #fff) !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  cursor: pointer;
  background:
    linear-gradient(145deg, var(--asfb-glass-hi, rgba(255, 255, 255, 0.32)) 0%, var(--asfb-glass-lo, rgba(255, 255, 255, 0.1)) 100%),
    color-mix(in srgb, var(--asfb, #9CB5BC) 58%, transparent);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  box-shadow:
    0 0 0 1px var(--asfb-glow, rgba(156, 181, 188, 0.45)),
    0 10px 28px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
  transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease, border-color 140ms ease;
}

.asbd-cta-asfb:hover {
  transform: translateY(-1px);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.14) 100%),
    color-mix(in srgb, var(--asfb-bright, #B8D0D6) 62%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--asfb-bright, #B8D0D6) 65%, transparent),
    0 14px 36px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.asbd-cta-asfb:focus-visible {
  outline: 2px solid var(--asfb-bright, #B8D0D6);
  outline-offset: 3px;
}

.asbd-cta-asfb--sm {
  min-height: 40px;
  padding: 0 18px;
  font-size: 14px;
  border-radius: 10px;
}

.asbd-cta-asfb--ghost {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.42);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.asbd-cta-asfb--ghost:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.65);
}