section,
.container {
  display: flex;
  flex-direction: row;
  width: 100%;
  padding-top: var(--unit-14);
  padding-right: var(--site-padding);
  padding-bottom: var(--unit-14);
  padding-left: var(--site-padding);
  overflow: hidden;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
section > div,
.container > .wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  gap: var(--unit-8);
  position: relative;
  z-index: 6;
}
.container .wrapper > div {
  width: 100%;
  z-index: 10;
}
section,
.container.horizontal {
  flex-direction: row;
}
section,
.container.vertical {
  flex-direction: column;
}
section > div,
.container > .wrapper.horizontal {
  flex-direction: row;
}
section > div,
.container > .wrapper.vertical {
  flex-direction: column;
}
main section.hero {
  height: 80vh;
  min-height: 720px;
  gap: var(--unit-14);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top;
}
main section:first-child .wrapper,
section.hero .wrapper {
  gap: var(--unit-0);
}
main section:first-child .wrapper > div {
  gap: var(--unit-7);
}
/* section.hero .wrapper > div:has(.carousel) {
  width: 65%;
} */
main section:first-child .wrapper div:not(.card) > h1,
section.hero .wrapper div:not(.card) > h1 {
  font-family: var(--font-family-headline-sm);
  font-size: var(--font-size-headline-sm);
  font-weight: var(--font-weight-headline-sm);
  line-height: var(--line-height-headline-sm);
}
main section:first-child .wrapper div:not(.card) > p,
section.hero .wrapper div:not(.card) > p {
  font-family: var(--font-family-body);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-body);
  line-height: var(--line-height-body);
}
main section:first-child,
main .container:first-child {
  padding-top: var(--unit-0);
  padding-bottom: var(--unit-0);
}

/* Styles */

section.darken *,
section.light-dark {
  color: var(--white);
}
section.darken:before,
section.light-dark:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--black-0-25);
  z-index: 4;
}
section.darken.top:before {
  background: linear-gradient(
    0deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.4662) 46%,
    rgba(0, 0, 0, 0.84) 100%
  );
}
section.darken.right:before {
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.4662) 46%,
    rgba(0, 0, 0, 0.84) 100%
  );
}
section.darken.bottom:before {
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.4662) 46%,
    rgba(0, 0, 0, 0.84) 100%
  );
}
section.darken.left:before {
  background: linear-gradient(
    270deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.4662) 46%,
    rgba(0, 0, 0, 0.84) 100%
  );
}

section.light-dark.top:before {
  background: linear-gradient(
    0deg,
    rgba(255, 255, 255, 0) 41.29%,
    rgba(38, 38, 38, 0.7) 100.41%
  );
  background-blend-mode: multiply;
}

.video-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
}
.:before {
  content: "";
  position: absolute;
  background: var(--black);
}