/* Base tokens (keep this file small + reusable)
   Put shared color variables and button primitives here. */

:root {
  --sand-0: #fbfaf7;
  --sand-1: #f6f1e7;
  --sand-2: #efe7da;
  --stone-1: #ece9e3;
  --stone-2: #ded9d1;
  --ink-1: #2b2f33;
  --ink-2: #5b646d;
  --blue-1: #9cc3dc;
  --blue-2: #89a7b8;
  --shadow: 0 18px 50px rgba(35, 36, 38, .08);
  --shadow-soft: 0 12px 30px rgba(35, 36, 38, .07);
  --radius-lg: 28px;
  --radius-md: 20px;
  --radius-sm: 16px;
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --ease-soft: cubic-bezier(.22, .61, .36, 1);
  --dur-1: 160ms;
  --dur-2: 260ms;
}

/* Buttons (primitives only) */

.btn-pill {
  border-radius: 999px;
  padding: 12px 18px;
  font-weight: 500;
  letter-spacing: .01em;
}

.btn-lg.btn-pill {
  padding: 14px 22px;
}

.btn-primary {
  --bs-btn-bg: rgb(169,203,218);
  --bs-btn-border-color: rgba(111, 143, 163, .70);
  --bs-btn-hover-bg: rgb(67,91,117);
  --bs-btn-hover-border-color: rgba(111, 143, 163, .9);
  --bs-btn-active-bg: rgba(111, 143, 163, 1);
  --bs-btn-active-border-color: rgba(111, 143, 163, 1);
  --bs-btn-color: #ffffff;
  --bs-btn-hover-color: #ffffff;
}

.btn-outline-soft {
  --bs-btn-border-color: rgba(255,255,255,.55);
  --bs-btn-color: rgba(255,255,255,.92);
  --bs-btn-hover-bg: rgba(255,255,255,.10);
  --bs-btn-hover-border-color: rgba(255,255,255,.75);
  --bs-btn-hover-color: #ffffff;
}

.btn-outline-primary-soft {
  --bs-btn-border-color: rgba(111, 143, 163, .35);
  --bs-btn-color: rgba(43, 47, 51, .86);
  --bs-btn-hover-bg: rgba(111, 143, 163, .10);
  --bs-btn-hover-border-color: rgba(111, 143, 163, .45);
  --bs-btn-hover-color: rgba(43, 47, 51, .92);
}

.btn-pill {
}

.btn-pill.btn-hero {
}