/* BCM Base Styles & Palette */

:root {
  /* BCM Colors */
  --bcm-dark-brown: #584738;
  --bcm-medium-brown: #B59E7D;
  --bcm-light-beige: #CEC1A8;
  --bcm-gray-beige: #AAA396;
  --bcm-cream: #F1EADA;
  --bcm-dark-olive: #5B5546;
  --bcm-rust: #875F45;
  --bcm-charcoal: #302E2C;
  --bcm-off-white: #F8F7F3;
  --bcm-stone: #BCB3A6;

  --page-bg: var(--bcm-off-white);
  --text-main: var(--bcm-charcoal);

  --container-max: 1120px;
  --gutter: clamp(1.5rem, 5vw, 3.5rem);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: "Alegreya Sans", system-ui, -apple-system, sans-serif;
  color: var(--text-main);
  background-color: var(--page-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  cursor: url("../icon/cursor.svg") 0 0, auto;
}

/* Bold cursor on interactive elements */
a:hover,
button:hover,
.menu-toggle:hover,
.overlay-nav-list a:hover {
  cursor: url("../icon/cursor (1).svg") 0 0, pointer;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

main.bcm-main {
  padding-inline: var(--gutter);
  max-width: var(--container-max);
  margin: 0 auto;
}