/* Design tokens & reset */
:root {
  --site-max: 980px;
  --header-h: 130px;
  --content-offset: 226px; /* 696 - 470 at 1920 */

  --color-text: #3c4547;
  --color-text-white: #ffffff;
  --color-gold: #ae8800;
  --color-gold-btn: #d4a80b;
  --color-gold-band: #d4a80b;
  --color-header: #000000;
  --color-footer: #000000;

  --font-stack: "Helvetica Neue", Helvetica, Arial, sans-serif;

  --text-xl: 700 65px/58.5px var(--font-stack);
  --text-lg: 700 23px/20.7px var(--font-stack);
  --text-md: 700 18px/16.2px var(--font-stack);
  --body-lg: 300 24px/26.4px var(--font-stack);
  --body-md: 300 18px/19.8px var(--font-stack);
  --nav: 400 14px/19.6px var(--font-stack);
  --btn: 400 16px/37px var(--font-stack);
  --logo-text: 300 25px/normal var(--font-stack);
  --quote: 400 16px/1.2 var(--font-stack);
  --footer-sm: 400 12px/normal var(--font-stack);
  --footer-md: 400 13px/normal var(--font-stack);
  --footer-lg: 400 14px/normal var(--font-stack);

  --btn-h: 37px;
  --btn-min: 135px;
}

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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-stack);
  font-size: 10px;
  color: var(--color-text);
  background: #fff;
}

img {
  display: block;
  max-width: none;
  image-rendering: auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.media-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

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

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

h1,
h2,
h3,
p,
blockquote {
  margin: 0;
}

button {
  font: inherit;
  cursor: pointer;
  border: 0;
  background: none;
}

.site-container {
  width: var(--site-max);
  max-width: 100%;
  margin-inline: auto;
}

.heading-xl {
  font: var(--text-xl);
  color: var(--color-text);
  text-transform: uppercase;
}

.heading-lg {
  font: var(--text-lg);
  color: var(--color-text);
  text-transform: uppercase;
}

.heading-md {
  font: var(--text-md);
  color: var(--color-text);
  text-transform: uppercase;
}

.body-lg {
  font: var(--body-lg);
  color: var(--color-text);
  text-transform: uppercase;
}

.body-md {
  font: var(--body-md);
  color: var(--color-text);
  text-transform: uppercase;
}

.body-md--on-dark {
  color: var(--color-text-white);
}

.heading-xl--white,
.heading-lg--white {
  color: var(--color-text-white);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--btn-min);
  height: var(--btn-h);
  padding: 0;
  background: var(--color-gold-btn);
  color: var(--color-text-white);
  font: var(--btn);
  text-transform: uppercase;
}

.btn--wide {
  min-width: 261px;
}

.btn--reviews {
  min-width: 219px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.page-placeholder {
  min-height: 60vh;
  padding: 80px 0;
  background: #000;
  color: #fff;
}

.page-placeholder .heading-xl,
.page-placeholder .body-md {
  color: #fff;
}