/* Ported from Demo UI subscription.html — HeyLeads marketing design system */

    /* Standard Curvy Buttons */
    .btn {
      height: var(--btn-height-default);
      padding: 0 0.85rem;
      font-size: 0.72rem;
      font-weight: 600;
      border-radius: var(--radius-curvy);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.45rem;
      cursor: pointer;
      text-decoration: none;
      transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
      user-select: none;
      border: 1px solid transparent;
      outline: none;
      white-space: nowrap;
    }

    .btn:active {
      transform: scale(0.97);
    }

    .btn i {
      font-size: var(--icon-size-menu);
    }

    .btn-sm {
      height: var(--btn-height-sm);
      padding: 0 0.65rem;
      font-size: 0.68rem;
    }

    .btn-lg {
      height: var(--btn-height-lg);
      padding: 0 1.15rem;
      font-size: 0.8rem;
    }

    /* Solid brand CTAs (opaque fills — not hollow neon) */
    .btn-primary {
      background: #4f46e5;
      color: #ffffff;
      border-color: #4338ca;
      box-shadow: 0 3px 14px rgba(79, 70, 229, 0.35);
      transition: background 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .btn-primary:hover {
      background: #4338ca;
      color: #ffffff;
      border-color: #3730a3;
      box-shadow: 0 4px 18px rgba(67, 56, 202, 0.42);
    }

    [data-theme="light"] .btn-primary {
      background: #4338ca;
      color: #ffffff;
      border-color: #4338ca;
      box-shadow: 0 3px 12px rgba(67, 56, 202, 0.32);
    }
    [data-theme="light"] .btn-primary:hover {
      background: #3730a3;
      border-color: #3730a3;
    }

    .btn-success {
      background: rgba(16, 185, 129, 0.12);
      color: #34d399;
      border-color: rgba(16, 185, 129, 0.4);
    }
    .btn-success:hover {
      background: rgba(16, 185, 129, 0.22);
      color: #ffffff;
      border-color: rgba(16, 185, 129, 0.8);
    }
    [data-theme="light"] .btn-success {
      background: #059669;
      color: #ffffff;
      border-color: #059669;
    }

    .btn-neutral {
      background: rgba(255, 255, 255, 0.04);
      color: var(--text-body);
      border-color: var(--border-subtle);
    }
    .btn-neutral:hover {
      background: rgba(255, 255, 255, 0.08);
      color: var(--text-heading);
      border-color: var(--border-strong);
    }
    [data-theme="light"] .btn-neutral {
      background: #ffffff;
      color: #0f172a;
      border-color: rgba(0, 0, 0, 0.12);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    }

    .btn-sky {
      background: #0284c7;
      color: #ffffff;
      border-color: #0369a1;
      box-shadow: 0 3px 14px rgba(2, 132, 199, 0.35);
      transition: background 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .btn-sky:hover {
      background: #0369a1;
      color: #ffffff;
      border-color: #075985;
      box-shadow: 0 4px 18px rgba(3, 105, 161, 0.42);
    }
    [data-theme="light"] .btn-sky {
      background: #0284c7;
      color: #ffffff;
      border-color: #0284c7;
      box-shadow: 0 3px 12px rgba(2, 132, 199, 0.32);
    }
    [data-theme="light"] .btn-sky:hover {
      background: #0369a1;
      border-color: #0369a1;
    }

    .btn-purple {
      background: rgba(168, 85, 247, 0.12);
      color: #c084fc;
      border-color: rgba(168, 85, 247, 0.45);
      box-shadow: 0 0 14px -2px rgba(168, 85, 247, 0.25);
    }
    .btn-purple:hover {
      background: rgba(168, 85, 247, 0.22);
      color: #ffffff;
      border-color: rgba(168, 85, 247, 0.8);
      box-shadow: 0 0 20px -2px rgba(168, 85, 247, 0.5);
    }
    [data-theme="light"] .btn-purple {
      background: #7e22ce;
      color: #ffffff;
      border-color: #7e22ce;
      box-shadow: 0 3px 12px rgba(126, 34, 206, 0.32);
    }
    [data-theme="light"] .btn-purple:hover {
      background: #6b21a8;
      border-color: #6b21a8;
    }

    .btn-orange {
      background: rgba(249, 115, 22, 0.12);
      color: #fb923c;
      border-color: rgba(249, 115, 22, 0.45);
      box-shadow: 0 0 14px -2px rgba(249, 115, 22, 0.25);
    }
    .btn-orange:hover {
      background: rgba(249, 115, 22, 0.22);
      color: #ffffff;
      border-color: rgba(249, 115, 22, 0.8);
      box-shadow: 0 0 20px -2px rgba(249, 115, 22, 0.5);
    }
    [data-theme="light"] .btn-orange {
      background: #ea580c;
      color: #ffffff;
      border-color: #ea580c;
      box-shadow: 0 3px 12px rgba(234, 88, 12, 0.32);
    }
    [data-theme="light"] .btn-orange:hover {
      background: #c2410c;
      border-color: #c2410c;
    }



/* Marketing aliases used in header / secondary CTAs */
.btn-ghost {
  background: transparent;
  color: var(--text-body);
  border-color: transparent;
}
.btn-ghost:hover {
  background: var(--bg-hover);
  color: var(--text-heading);
}
[data-theme="light"] .btn-ghost:hover {
  background: #e2e8f0;
}

/* Shared press contract for non-.btn switches (halo, pills, menu) */
.pressable {
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.pressable:active {
  transform: scale(0.97);
}
.btn-outline {
  background: transparent;
  color: var(--text-heading);
  border-color: var(--border-strong);
}
.btn-outline:hover {
  background: rgba(99, 102, 241, 0.12);
  border-color: rgba(99, 102, 241, 0.45);
  color: #818cf8;
  box-shadow: 0 0 14px -2px rgba(99, 102, 241, 0.3);
}
[data-theme="light"] .btn-outline {
  border-color: rgba(0, 0, 0, 0.12);
  color: #0f172a;
}
[data-theme="light"] .btn-outline:hover {
  background: rgba(67, 56, 202, 0.08);
  border-color: #4338ca;
  color: #4338ca;
  box-shadow: none;
}

/* Amber / Highlight CTA — solid fill */
.btn-warning {
  background: #d97706;
  color: #ffffff;
  border-color: #b45309;
  box-shadow: 0 3px 14px rgba(217, 119, 6, 0.35);
  transition: background 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-warning:hover {
  background: #b45309;
  color: #ffffff;
  border-color: #92400e;
  box-shadow: 0 4px 18px rgba(180, 83, 9, 0.42);
}
[data-theme="light"] .btn-warning {
  background: #d97706;
  color: #ffffff;
  border-color: #d97706;
  box-shadow: 0 3px 12px rgba(217, 119, 6, 0.32);
}
[data-theme="light"] .btn-warning:hover {
  background: #b45309;
  border-color: #b45309;
}