.surface-card {
  border: 1px solid rgba(229, 224, 216, 0.85);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--flc-shadow-editorial);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  padding: 0.75rem 1.25rem;
  border-radius: 999px;
  font-size: 0.925rem;
  font-weight: 700;
  line-height: 1;
  transition: transform 280ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              box-shadow 280ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              background-color 280ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              color 280ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              border-color 280ms var(--ease-editorial, cubic-bezier(.16,1,.3,1));
}

.btn:hover {
  transform: translateY(-1px);
}

.btn-primary {
  background: #1A3A52;
  color: #fff;
  box-shadow: var(--flc-shadow-editorial);
}

.btn-primary:hover {
  background: #9A7B4F;
  color: #fff;
  box-shadow: var(--flc-shadow-soft);
}

.btn-secondary {
  border: 1px solid rgba(26, 58, 82, 0.18);
  background: #fff;
  color: #1A3A52;
}

.btn-secondary:hover {
  border-color: rgba(154, 123, 79, 0.35);
  color: #9A7B4F;
  box-shadow: var(--flc-shadow-editorial);
}

.card {
  border: 1px solid rgba(229, 224, 216, 0.85);
  border-radius: var(--radius-lg);
  background: #fff;
  transition: transform 300ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              box-shadow 300ms var(--ease-editorial, cubic-bezier(.16,1,.3,1)),
              border-color 300ms var(--ease-editorial, cubic-bezier(.16,1,.3,1));
}

.card:hover {
  transform: translateY(-2px);
  border-color: rgba(154, 123, 79, 0.28);
  box-shadow: var(--flc-shadow-elevated);
}