.gds-secondary-hero {
  position: relative;
}

.gds-secondary-hero--spacer-m {
  margin-bottom: var(--spacer-m);
}

.gds-secondary-hero--spacer-l {
  margin-bottom: var(--spacer-l);
}

.gds-secondary-hero--spacer-xl {
  margin-bottom: var(--spacer-xl);
}

.gds-secondary-hero--spacer-xxl {
  margin-bottom: var(--spacer-xxl);
}

.gds-secondary-hero--spacer-huge {
  margin-bottom: var(--spacer-huge);
}

.gds-secondary-hero--spacer-massive {
  margin-bottom: var(--spacer-massive);
}

.gds-secondary-hero--dark-background {
  background-color: #036;
  background-color: var(--color-primary);
}

.gds-secondary-hero--dark-background .gds-heading,
.gds-secondary-hero--dark-background .gds-paragraph {
  color: #fff;
  color: var(--color-light);
}

.gds-secondary-hero--dark-background h1.gds-heading--l,
.gds-secondary-hero--dark-background h2.gds-heading--l,
.gds-secondary-hero--dark-background h3.gds-heading--l,
.gds-secondary-hero--dark-background h4.gds-heading--l,
.gds-secondary-hero--dark-background h5.gds-heading--l {
  margin-bottom: var(--spacer-s);
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero--dark-background h1.gds-heading--l,
  .gds-secondary-hero--dark-background h2.gds-heading--l,
  .gds-secondary-hero--dark-background h3.gds-heading--l,
  .gds-secondary-hero--dark-background h4.gds-heading--l,
  .gds-secondary-hero--dark-background h5.gds-heading--l {
    margin-bottom: var(--spacer-l);
  }
}

.gds-secondary-hero--has-separator {
  border-bottom: 1px solid #d6ebff;
  border-bottom: 1px solid var(--color-primary-light);
}

.gds-secondary-hero--has-video .gds-cell--l-order-2 {
  display: none;
}

.gds-secondary-hero__container {
  position: relative;
}

@media (max-width: 767px) {
  .gds-secondary-hero__content {
    margin-bottom: var(--spacer-s);
  }
}

.gds-secondary-hero__cards-container {
  background: rgba(0, 0, 0, 0);
  position: relative;
}

.gds-secondary-hero__cards-container::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: calc(100% - var(--spacer-l));
  background-color: #fff;
  background-color: var(--color-light);
}

.gds-secondary-hero__embed {
  padding-bottom: var(--spacer-l);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-top: calc(var(--spacer-m) * -1);
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero__embed {
    padding: var(--spacer-m) 0;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
    margin-top: 0;
  }
}

.gds-secondary-hero--blue-background {
  background-color: #f5faff;
  background-color: var(--color-primary-lightest);
}

.gds-secondary-hero--no-background .gds-secondary-hero__content {
  margin-bottom: 0;
}

@media screen and (min-width: 0) {
  .gds-secondary-hero--no-background .gds-secondary-hero__content {
    min-height: 80px;
  }
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero--no-background .gds-secondary-hero__content {
    padding-right: var(--spacer-xxl);
    min-height: 88px;
  }
}

@media screen and (min-width: 992px) {
  .gds-secondary-hero--no-background .gds-secondary-hero__content {
    padding-right: var(--spacer-xxl);
    min-height: 104px;
  }
}

@media print {
  .gds-secondary-hero--no-background .gds-secondary-hero__content {
    padding-right: var(--spacer-xxl);
    min-height: 104px;
  }
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero--has-background .gds-secondary-hero__content {
    padding-right: var(--spacer-xxl);
    min-height: 192px;
  }
}

@media screen and (min-width: 992px) {
  .gds-secondary-hero--has-background .gds-secondary-hero__content {
    min-height: 240px;
  }
}

@media print {
  .gds-secondary-hero--has-background .gds-secondary-hero__content {
    min-height: 240px;
  }
}

.gds-secondary-hero__content {
  position: relative;
  padding: var(--spacer-m) 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero__content {
    padding-right: var(--spacer-xxl);
  }
}

.gds-secondary-hero__content .gds-heading {
  margin-bottom: var(--spacer-xs);
}

.gds-secondary-hero__content p:last-child {
  margin-bottom: 0;
}

.gds-secondary-hero__buttons {
  display: flex;
  justify-content: center;
  margin-bottom: calc(var(--spacer-l) - var(--spacer-m));
}

@media screen and (min-width: 0) {
  .gds-secondary-hero__buttons {
    flex-direction: column;
    align-items: center;
  }

  .gds-secondary-hero__buttons .gds-btn + .gds-btn {
    margin-top: var(--spacer-m);
  }
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero__buttons {
    justify-content: flex-start;
    flex-direction: row;
  }
}

@media screen and (min-width: 0) {
  .gds-secondary-hero__buttons--wide {
    align-items: stretch;
  }
}

@media (max-width: 767px) {
  .gds-secondary-hero__buttons--wide > div:first-child {
    margin-bottom: var(--spacer-m);
  }
}

.gds-secondary-hero .gds-background-video-layout .gds-cell--s-order-1 {
  display: none;
}

.gds-secondary-hero .gds-btn {
  margin-right: var(--spacer-s);
  white-space: nowrap;
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero .gds-btn {
    margin-top: 0 !important;
  }
}

.gds-secondary-hero__background-image {
  width: 100%;
  height: 100%;
}

.gds-secondary-hero__background-image .gds-image,
.gds-secondary-hero__background-image .gds-image-zoom {
  width: 100%;
  position: relative;
  left: calc(-1 * var(--spacer-s));
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero__background-image .gds-image,
  .gds-secondary-hero__background-image .gds-image-zoom {
    position: absolute;
    height: 100%;
    right: 0;
    left: 50%;
    max-width: 1440px;
    transform: translateX(-50%);
  }

  [dir="rtl"] .gds-secondary-hero__background-image .gds-image,
  [dir="rtl"] .gds-secondary-hero__background-image .gds-image-zoom {
    transform: translateX(50%);
  }
}

.gds-secondary-hero__background-image .gds-image {
  position: inherit;
}

@media screen and (min-width: 768px) {
  .gds-secondary-hero__background-image .gds-image {
    position: absolute;
  }
}

.transparent .gds-heading--l {
  color: var(--color-primary);
}