/* -------------------------------------------------- */
/* Variables */
/* -------------------------------------------------- */
:root {
  --color-text: #231f20;
  --color-grey: #75757a;
  --color-yellow: #fccd2e;
  --color-light-blue: #1aafd5;
  --color-blue-100: #f2f6fd;
  --color-blue-200: #e9f0fb;
  --section-padding-block: var(--spacing-lg);
}
@media (max-width: 1000px) {
  :root {
    --section-padding-block: var(--spacing-md);
  }
}

/* -------------------------------------------------- */
/* Utilities */
/* -------------------------------------------------- */
h1,
h2,
h3 {
  color: var(--color-text);
}
h1 strong,
h2 strong,
h3 strong {
  font-weight: bold;
}

/* -------------------------------------------------- */
/* Blocks */
/* -------------------------------------------------- */
.client-hero {
  background-color: black;
  color: white;
  margin-top: var(--header-height);
  padding-block: var(--section-padding-block);
  min-height: min(900px, 100vh - 140px);
  display: flex;
  align-items: center;
  box-sizing: border-box;
  position: relative;
  overflow: clip;
}
@media (max-width: 1000px) {
  .client-hero {
    min-height: 0;
  }
}

.client-hero__image {
  position: absolute;
  top: -100px;
  left: 0;
  bottom: -100px;
  right: 0;
  background-position: center;
  background-size: cover;
  opacity: 0.5;
}
@media (max-width: 1000px) {
  .client-hero__image {
    -o-object-position: top;
       object-position: top;
  }
}

.client-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.client-hero__headline {
  color: inherit;
  margin: 0;
  line-height: 1.2;
  max-width: 45rem;
  box-sizing: border-box;
  font-size: var(--font-size-xxl);
}
.client-hero__headline strong {
  color: var(--color-yellow);
}
@media (max-width: 1000px) {
  .client-hero__headline {
    font-size: var(--font-size-xl2);
  }
}

.client-hero__text {
  font-size: var(--font-size-xl);
  max-width: 45rem;
  line-height: 1.5;
  box-sizing: border-box;
}
@media (max-width: 1000px) {
  .client-hero__text {
    font-size: var(--font-size-lg);
  }
}

.client-hero__buttons {
  -webkit-margin-before: var(--spacing-xs);
          margin-block-start: var(--spacing-xs);
}

.client-usecases {
  padding-block: var(--section-padding-block);
  text-align: center;
  background-color: var(--color-blue-100);
}
@media (max-width: 1000px) {
  .client-usecases {
    padding-block: var(--spacing-lg);
  }
}

.client-usecases__content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.client-usecases__headline {
  margin: 0 auto;
  font-family: "UnitSlab", sans-serif;
  font-weight: bold;
  max-width: 700px;
}

.client-usecases__text {
  margin: 0 auto;
  max-width: 900px;
  line-height: 1.25;
}

.usecases-sections {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  margin-block: var(--spacing-md);
}

.usecase-section {
  display: grid;
  align-items: start;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-md);
  text-align: left;
}
@media (max-width: 1000px) {
  .usecase-section {
    grid-template-columns: 1fr;
    gap: var(--spacing-xs);
  }
}
.usecase-section__image {
  border: 1px solid var(--color-text);
  border-radius: 0.5rem;
  overflow: clip;
}
.usecase-section__image img {
  width: 100%;
  height: auto;
}
.usecase-section__headline {
  margin: 0;
}
.usecase-section__text {
  line-height: 1.25;
}

.client-cards {
  padding-block: var(--section-padding-block);
  text-align: center;
}

.client-cards__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-md);
}
@media (max-width: 1000px) {
  .client-cards__content {
    gap: var(--spacing-sm);
  }
}

.client-cards__headline {
  margin: 0;
  font-weight: bold;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--spacing-sm);
}

.card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  background-color: var(--color-blue-100);
  border-radius: 0.5rem;
  padding: 1rem;
}

.card__icon img {
  width: 5rem;
  height: auto;
}

.card__title {
  font-size: inherit;
  color: var(--color-light-blue);
  font-weight: bold;
  margin: 0;
}

.card__text {
  line-height: 1.25;
}

.card__buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-xs);
}

.client-clients {
  background-size: cover;
  color: white;
  padding-block: var(--section-padding-block);
}
.client-clients__headline {
  color: var(--color-light-blue);
  font-family: "UnitSlab", sans-serif;
  font-weight: bold;
  text-align: center;
  margin: 0;
  -webkit-margin-after: 2rem;
          margin-block-end: 2rem;
}
.client-clients__list {
  font-size: var(--font-size-lg);
  max-width: 800px;
  margin-inline: auto;
  line-height: 1.25;
}
.client-clients__list ul {
  margin: 0;
}
.client-clients__list li {
  margin-block: 0.75rem;
}

.client-quote {
  padding-block: var(--section-padding-block);
}
.client-quote__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.client-quote__text {
  font-family: "UnitSlab", sans-serif;
  font-size: var(--font-size-xl);
  line-height: 1.2;
  margin: 0;
  max-width: 50ch;
}
.client-quote__text p {
  margin: 0;
}
.client-quote__logo img {
  max-width: 20rem;
  height: auto;
}
@media (max-width: 1000px) {
  .client-quote__logo img {
    max-width: 15rem;
  }
}

.client-text {
  padding-block: var(--section-padding-block);
  background-color: var(--color-blue-100);
}
.client-text__content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xxs);
}
.client-text__headline {
  font-family: "UnitSlab", sans-serif;
  font-weight: bold;
  margin: 0 auto;
  text-align: center;
  font-size: var(--font-size-xl);
  max-width: 700px;
}
.client-text__subheadline {
  font-family: "UnitSlab", sans-serif;
  text-align: center;
  font-weight: 500;
  font-size: var(--font-size-lg);
  margin: 0 auto;
  max-width: 700px;
}
.client-text__text {
  line-height: 1.25;
  -webkit-margin-before: 2rem;
          margin-block-start: 2rem;
}
.client-text__text > *:first-child {
  -webkit-margin-before: 0;
          margin-block-start: 0;
}
.client-text__text > *:last-child {
  -webkit-margin-after: 0;
          margin-block-end: 0;
}
.client-text__text strong {
  color: var(--color-light-blue);
}

.client-calltoaction {
  padding-block: var(--section-padding-block);
  background-image: var(--background-image);
  background-size: cover;
  background-position: center;
  color: white;
  position: relative;
}

.client-calltoaction__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: var(--spacing-sm);
}
@media (max-width: 1000px) {
  .client-calltoaction__content {
    gap: var(--spacing-sm);
  }
}

.client-calltoaction__text {
  margin: 0;
  font-family: "UnitSlab", sans-serif;
  font-size: var(--font-size-xxl);
  color: white;
  line-height: 1.25;
  max-width: 50ch;
  text-wrap: balance;
}
.client-calltoaction__text strong {
  font-weight: inherit;
  color: var(--color-light-blue);
}
.client-calltoaction__text p {
  margin: 0;
}

/*# sourceMappingURL=landing_client.css.map */