@font-face {
  font-family: "Roboto";
  src: url("../fonts/google/roboto-300.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/google/roboto-400.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/google/roboto-500.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/google/roboto-600.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/google/roboto-700.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/google/unbounded-300.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/google/unbounded-400.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/google/unbounded-500.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/google/unbounded-600.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("../fonts/google/unbounded-700.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

.hero-section.home-videobg > video {
  object-position: 50% 38%;
  top: -6%;
  bottom: auto;
  height: 112%;
}

.cms-card-link {
  color: inherit;
  text-decoration: none;
  display: block;
  height: 100%;
}

.cms-filled .w-dyn-empty {
  display: none;
}

.cms-detail-section {
  padding-top: 160px;
}

.cms-detail-grid {
  grid-column-gap: 56px;
  grid-row-gap: 48px;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  align-items: center;
  display: grid;
}

.cms-detail-title {
  margin-bottom: 32px;
}

.cms-detail-logo {
  max-width: 240px;
  max-height: 96px;
  object-fit: contain;
}

.cms-detail-image {
  width: 100%;
  max-height: 620px;
}

.cms-detail-actions {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-wrap: wrap;
  margin-top: 40px;
}

.cms-service-detail {
  text-align: center;
  max-width: 850px;
  margin-left: auto;
  margin-right: auto;
}

.cms-service-detail .card-icons {
  margin-bottom: 40px;
}

.cms-related-section {
  padding-top: 80px;
}

.cms-related-grid {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  display: grid;
}

.cms-related-card {
  height: 100%;
}

@media screen and (max-width: 991px) {
  .cms-detail-section {
    padding-top: 120px;
  }

  .cms-detail-grid,
  .cms-related-grid {
    grid-template-columns: 1fr;
  }
}

/* Contact form: message field spans full width, submit button sits below it
   (not squeezed into the right grid column). Matches rmb.dev. */
.contact-grid-3 .contact-message-wrap {
  grid-column: 1 / -1;
}
.contact-grid-3 .main-button.dark.submit {
  grid-column: 1 / -1;
  align-self: start;
}