.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.8rem 1.25rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 700;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

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

.button--solid {
  background: var(--copper);
  color: #fff9f4;
}

.button--solid:hover {
  background: var(--copper-deep);
  color: #fff9f4;
}

.button--ghost {
  border-color: rgba(19, 33, 42, 0.16);
  background: rgba(255, 255, 255, 0.55);
}

.product-card,
.status-card,
.hero-card,
.media-panel,
.contact-panel {
  border: 1px solid rgba(19, 33, 42, 0.08);
  background: rgba(255, 255, 255, 0.82);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow);
}

.product-card img,
.hero-card img {
  border-radius: calc(var(--radius-md) - 0.25rem);
  object-fit: cover;
}

.product-card__body,
.status-card,
.media-panel,
.contact-panel {
  padding: var(--space-5);
}

.status-card--accent {
  border-color: rgba(180, 94, 47, 0.28);
  background: #fff6f0;
}