:root {
  --bb-font: "Helvetica Neue Beeldbrekers", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --bb-page-top: 21.5rem;
  --bb-page-bottom: 8rem;
  --bb-section-space: 10rem;
  --bb-column-gap: 10%;
  --bb-text-size: 2rem;
  --bb-text-line: 1.5;
  --bb-heading-1: 3rem;
  --bb-heading-2: 2.6rem;
  --bb-heading-3: 2.2rem;
  --bb-heading-line: 1.25;
  --bb-paragraph-space: 1.6rem;
}

html,
body,
button,
input,
select,
textarea,
.wrapper-home,
.wrapper-home h2 {
  font-family: var(--bb-font);
}

body {
  font-size: var(--bb-text-size);
  line-height: var(--bb-text-line);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--bb-font);
  font-weight: 400;
  line-height: var(--bb-heading-line);
}

h1 { font-size: var(--bb-heading-1); }
h2 { font-size: var(--bb-heading-2); }
h3, h4, h5, h6 { font-size: var(--bb-heading-3); }

.entry-content p + p,
.case .content p + p,
.studio-section__content p + p,
.contact-page__details p + p {
  margin-top: var(--bb-paragraph-space);
}

.homepage,
.studio-sections,
.contact-page,
.case-archive,
.single-case-container,
div.page {
  padding-bottom: var(--bb-page-bottom);
  padding-top: var(--bb-page-top);
}

.studio-section,
.case {
  margin-bottom: var(--bb-section-space);
}

.studio-section__content,
.contact-page__details,
.case .content,
.entry-content {
  font-size: var(--bb-text-size);
  line-height: var(--bb-text-line);
}

.studio-section__content h1,
.studio-section__content h2,
.studio-section__content h3,
.studio-section__content h4,
.studio-section__content h5,
.studio-section__content h6,
.contact-page__details h1,
.contact-page__details h2,
.case h1,
.case h2,
.entry-title {
  font-size: var(--bb-heading-1);
  line-height: var(--bb-heading-line);
  margin-bottom: 2.4rem;
}

.contact-page__layout {
  gap: var(--bb-column-gap);
}

.homepage img,
.studio-sections img,
.contact-page img,
.case img,
.featured-hero {
  max-width: 100%;
}

@media (max-width: 767px) {
  :root {
    --bb-page-top: 14rem;
    --bb-page-bottom: 5rem;
    --bb-section-space: 6rem;
    --bb-text-size: 1.9rem;
    --bb-heading-1: 2.7rem;
    --bb-heading-2: 2.4rem;
    --bb-heading-3: 2.1rem;
  }
}