/* DeskWolf design system — inferred from usage */
:root {
  --ink-0: #0B0F1A;
  --ink-1: #121722;
  --bone: #FAF8F3;
  --cream-0: #FAF8F3;
  --cream-1: #F1EEE6;
  --cream-2: #E5E1D6;
  --cream-line: rgba(11,15,26,0.08);
  --cream-line-strong: rgba(11,15,26,0.14);
  --paper: #FFFFFF;
  --blue: #10B981;
  --blue-2: #34D399;
  --amber: #F59E0B;
  --green: #10B981;
  --green-soft: rgba(16,185,129,0.12);
  --text-1: #1F2533;
  --text-2: #4A5162;
  --text-3: #6B7387;
  --text-4: #9AA1B3;

  --r-pill: 999px;
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);

  --shadow-xs: 0 1px 2px rgba(11,15,26,0.05);
  --shadow-sm: 0 2px 6px rgba(11,15,26,0.06);
  --shadow-md: 0 10px 30px -12px rgba(11,15,26,0.14);
  --shadow-lg: 0 30px 60px -20px rgba(11,15,26,0.22);
  --shadow-xl: 0 50px 100px -30px rgba(11,15,26,0.3);

  --font-sans: "Plus Jakarta Sans", -apple-system, "Helvetica Neue", Inter, sans-serif;
  --font-display: "Plus Jakarta Sans", -apple-system, "Helvetica Neue", Inter, sans-serif;
  --font-mono: "Plus Jakarta Sans", -apple-system, "Helvetica Neue", Inter, sans-serif;
}

.dw-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 28px;
}

.dw-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 20px;
  border-radius: var(--r-pill);
  font-weight: 500;
  font-size: 15px;
  text-decoration: none;
  transition: transform .28s var(--ease-out-expo), box-shadow .32s var(--ease-out-expo), background .22s;
  cursor: pointer;
  border: none;
  font-family: inherit;
  position: relative;
}
.dw-btn--primary {
  background: var(--bone);
  color: var(--ink-0);
  box-shadow: 0 1px 2px rgba(250,248,243,0.18), 0 8px 20px -4px rgba(250,248,243,0.22), 0 26px 52px -12px rgba(250,248,243,0.28);
}
.dw-btn--primary:hover { transform: translateY(-2px); }
.dw-btn--ghost-dark {
  background: rgba(255,255,255,0.04);
  color: var(--bone);
  border: 1px solid rgba(255,255,255,0.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.dw-btn--ghost-dark:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(0,85,255,0.5);
  transform: translateY(-2px);
}
