/* Phase 9C extracted homepage visual CSS. */

.section-card.home-hero {
  padding-top: 180px;
  overflow: hidden;
}

.home-hero-grid {
  grid-column-gap: var(--sizes--size-64);
  grid-row-gap: var(--sizes--size-64);
  grid-template-rows: auto;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
}

.partners {
  grid-column-gap: var(--sizes--size-24);
  grid-row-gap: var(--sizes--size-24);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.hero-float-image {
  width: 12%;
  max-width: 70px;
  position: absolute;
  inset: 0% 0% auto auto;
  transform: translate(54%, -60%)rotate(122deg);
}

.slider-wrapper {
  background-color: #0000;
  height: 100%;
}

.slider-mask {
  height: 100%;
}

.slider-mask.free-source-slider {
  max-width: 460px;
  overflow: visible;
}

.slide-mg-right-40px {
  margin-right: var(--sizes--size-40);
}

.slider-arrow {
  border: 1px solid var(--colors--neutral--100);
  border-radius: var(--border-radius--br-3);
  background-color: var(--colors--neutral--white);
  min-width: 48px;
  max-width: 48px;
  min-height: 48px;
  max-height: 48px;
  color: var(--colors--neutral--500);
  font-family: Custom Icons, Arial, sans-serif;
  font-size: var(--font-sizes--default);
  transform-style: preserve-3d;
  justify-content: center;
  align-items: center;
  padding-bottom: 2px;
  line-height: 1em;
  transition: box-shadow .3s, color .3s, border-color .3s, background-color .3s, transform .3s;
  display: flex;
  box-shadow: 0 2px 3px #7a76910f, inset 0 -1.5px 2px #4b4d8312;
}

.slider-arrow:hover {
  border-color: var(--colors--primary--600);
  background-color: var(--colors--primary--600);
  color: var(--colors--neutral--white);
  transform: scale3d(.96, .96, 1.001);
  box-shadow: inset 0 1px 3px #ffffff4d, 0 5px 7px #0d0c6126, inset 0 -1.5px 2px #00738680;
}

.slider-arrow.top-right---left {
  inset: -112px 64px auto auto;
}

.slider-arrow.top-right---right {
  inset: -112px 0% auto auto;
}

.float-images-wrapper {
  flex-flow: column;
  max-width: 510px;
  display: flex;
}

.float-image-left {
  z-index: 1;
  border-radius: 86px 32px 32px;
  width: 79%;
  position: relative;
  box-shadow: 16px 20px 20px #25515826;
}

.float-image-right {
  border-radius: 32px 32px 64px;
  width: 80%;
  margin-top: -33%;
  margin-left: auto;
  position: relative;
}

.lightbox-wrapper {
  border-radius: var(--border-radius--br-5);
  width: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 20px #50547d4d;
}

.lightbox-image {
  z-index: 0;
  width: 100%;
  height: 100%;
  position: relative;
}

.lightbox-link {
  z-index: 2;
  border-radius: 50%;
  position: absolute;
  inset: 50% auto auto 50%;
  overflow: hidden;
  transform: translate(-50%, -50%);
  box-shadow: 0 18px 20px #05071ce6;
}

.slide-test {
  color: var(--font-color--text-title);
}

.lightbox-content-wrapper {
  z-index: 1;
  padding: var(--sizes--size-48);
  background-image: linear-gradient(#0000 28%, #00243899 82%);
  flex-flow: column;
  justify-content: flex-end;
  display: flex;
  position: absolute;
  inset: 0%;
}

.company-card.uplead-card {
  background-color: #f3fffe;
}

.company-card.singnaturely-card {
  background-color: #f2faff;
}

.company-logo-wrapper {
  grid-column-gap: var(--sizes--size-20);
  grid-row-gap: var(--sizes--size-20);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.company-logo {
  border-radius: 12px;
  min-width: 52px;
  max-width: 52px;
  min-height: 52px;
  max-height: 52px;
}

.link-wrapper.uplead-link {
  color: #00b4d1;
  font-weight: 600;
}

.link-wrapper.signaturely-link {
  color: #00a3fa;
  font-weight: 600;
}

.paragraph-small.text-partners {
  color: #6698a3;
}

.partners-wrapper {
  grid-column-gap: var(--sizes--size-12);
  grid-row-gap: var(--sizes--size-08);
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.home-hero-paragraph {
  max-width: 530px;
}

.title-lightbox {
  text-decoration: none;
  transition-property: none;
}

@media screen and (max-width: 991px) {
  .section-card.home-hero {
      padding-top: 160px;
    }
  
    .home-hero-grid {
      grid-template-columns: 1.2fr;
    }
  
    .hero-float-image {
      transform: translate(42%, -92%)rotate(122deg);
    }
  
    .slide-mg-right-40px {
      margin-right: var(--sizes--size-32);
    }
  
    .float-images-wrapper {
      max-width: 100%;
    }
  
    .lightbox-content-wrapper {
      padding: var(--sizes--size-32);
    }
  
    .home-hero-paragraph {
      max-width: none;
      padding-right: 40px;
    }
}

@media screen and (max-width: 767px) {
  .section-card.home-hero {
      padding-top: 140px;
    }
  
    .home-hero-grid {
      grid-column-gap: var(--sizes--size-48);
      grid-row-gap: var(--sizes--size-48);
    }
  
    .hero-float-image {
      display: none;
    }
  
    .slider-wrapper.pd-bottom {
      padding-bottom: var(--sizes--size-80);
    }
  
    .slider-mask.free-source-slider {
      max-width: 360px;
    }
  
    .slide-mg-right-40px {
      margin-right: var(--sizes--size-24);
    }
  
    .slider-arrow.top-right---left {
      margin-right: var(--sizes--size-08);
      inset: auto 50% 0% auto;
    }
  
    .slider-arrow.top-right---right {
      margin-left: var(--sizes--size-08);
      inset: auto auto 0% 50%;
    }
  
    .float-image-left {
      border-radius: 65px 24px 24px;
    }
  
    .float-image-right {
      border-top-left-radius: 24px;
      border-top-right-radius: 24px;
      border-bottom-left-radius: 24px;
    }
  
    .lightbox-wrapper {
      border-radius: var(--border-radius--br-4);
    }
  
    .lightbox-image {
      object-fit: cover;
    }
  
    .lightbox-image.v1 {
      min-height: 350px;
    }
  
    .lightbox-link {
      max-width: 56px;
    }
  
    .lightbox-content-wrapper {
      padding: var(--sizes--size-24);
    }
  
    .company-logo-wrapper {
      grid-column-gap: var(--sizes--size-12);
      grid-row-gap: var(--sizes--size-12);
    }
  
    .company-logo {
      min-width: 48px;
      max-width: 48px;
      min-height: 48px;
      max-height: 48px;
    }
  
    .home-hero-paragraph {
      padding-right: 0;
    }
}

@media screen and (max-width: 479px) {
  .home-hero-grid {
      grid-column-gap: var(--sizes--size-32);
      grid-row-gap: var(--sizes--size-32);
    }
  
    .partners {
      grid-column-gap: var(--sizes--size-16);
      grid-row-gap: var(--sizes--size-08);
      flex-flow: wrap;
    }
  
    .slider-mask.free-source-slider {
      max-width: 100%;
    }
  
    .float-image-left {
      border-radius: 48px 16px 16px;
    }
  
    .float-image-right {
      border-radius: 16px 16px 48px;
    }
  
    .lightbox-image.v1 {
      min-height: 375px;
    }
  
    .lightbox-link {
      max-width: 48px;
    }
  
    .lightbox-link.v1 {
      transform: translate(-50%, -75%);
    }
  
    .company-logo-wrapper {
      grid-column-gap: var(--sizes--size-08);
      grid-row-gap: var(--sizes--size-08);
    }
  
    .company-logo {
      border-radius: 8px;
      min-width: 40px;
      max-width: 40px;
      min-height: 40px;
      max-height: 40px;
    }
}