/* ══════════════════════════════════════════════════════════
   Buttons — .btn and all variants
   Shared across all Groteska sites.
   ══════════════════════════════════════════════════════════ */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-6) var(--space-8);
  border-radius: var(--radius-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
  cursor: pointer;
  transition: all var(--duration-normal) var(--ease-standard);
  border: none;
  text-decoration: none;
  position: relative;
}
.btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }

.btn--primary {
  background: var(--color-primary);
  color: var(--color-btn-primary-text);
}
.btn--primary:hover { background: var(--color-primary-hover); }
.btn--primary:active { background: var(--color-primary-active); }

.btn--secondary {
  background: var(--color-secondary);
  color: var(--color-text);
}
.btn--secondary:hover { background: var(--color-secondary-hover); }
.btn--secondary:active { background: var(--color-secondary-active); }

.btn--outline {
  background: transparent;
  border: 1px solid var(--line-light);
  color: var(--line-light);
}
.btn--outline:hover {
  background: rgba(106, 173, 223, 0.12);
  color: var(--white);
}

.btn--sm { padding: var(--space-3) var(--space-7); font-size: var(--font-size-sm); border-radius: var(--radius-sm); }
.btn--lg { padding: var(--space-7) var(--space-9); font-size: var(--font-size-lg); border-radius: var(--radius-md); }
.btn--full-width { width: 100%; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }