/* white theme - clean minimal light look, copper accent color.
   hero uses a photo bg instead of a gradient, dark overlay keeps the
   heading/button readable on top of it */
:root {
  --color-bg: #fafaf8;
  --color-surface: #ffffff;
  --color-text: #1c1c1a;
  --color-text-muted: #6b6b66;
  --color-primary: #2a2a27;
  --color-primary-dark: #141412;
  --color-accent: #ffffff;
  --color-accent-dark: #6d4f2c;
  --color-border: #eaeae6;
}

.hero {
  background:
    linear-gradient(180deg, rgba(20, 20, 18, .55) 0%, rgba(20, 20, 18, .32) 45%, rgba(20, 20, 18, .62) 100%),
    url('../images/hero-banner.jpg') center / cover no-repeat;
}


.hero::before,
.hero::after {
  display: none;
}