/* LOAN OFFER SECTION */

.section-offer {
  column-gap: var(--gap-normal);
  row-gap: var(--gap-large);
}

.hero-image--offer {
  background-image: url("../../images/sme_loan/our_offer/contact-service.55b0b20d6551.jpg");
}

.section-image--offer {
  background-image: url("../../images/sme_loan/our_offer/kamuno-kmu-kreditrahmen-mit-flexiblen-bezuegen.dd3d4287ee8b.png");
  background-position: unset;
  height: 48rem;
  align-self: end;
  margin-top: var(--margin-large);
}

.card-offer--image {
  height: 42rem;
  margin-bottom: var(--margin-normal);
}

/* .hero-offer--image-sub,
.card-offer--image {
  filter: grayscale(0.12);
} */

.card-offer--image-1 {
  background-image: url("../../images/sme_loan/our_offer/kamuno-flexibler-kreditrahmen-fuer-kmu.7b3c1a5441b0.png");
}

.card-offer--image-2 {
  background-image: url("../../images/sme_loan/our_offer/kamuno-faq-service-fuer-kmu.746f488f343f.jpg");
}

.card-fees {
  background-color: var(--color-tertiary);
  grid-column: 1 / span 2;
  /* Trick for changing grid-row-gap individually */
  transform: translateY(-10rem);
}

.card-fees a {
  justify-self: left;
  margin-top: 0;
  font-size: var(--font-text-default);
}

/* Responsive design */
@media only screen and (max-width: 84.375em) {
  .section-image--offer {
    background-size: contain;
 }
}

@media only screen and (max-width: 70em) {
 .hero-content {
   padding: 6.4rem 3rem;
 }

 .section-image--offer {
   align-self: start;
   margin-top: 8rem;
 }

 .section-image--offer {
   display: none;
 }

 .hero-content {
   grid-column: 1 / -1;
 }

 .card-offer--image {
   height: 32rem;
 }

 .section-offer {
   row-gap: 8rem;
   padding-bottom: 6.4rem;
 }

 .card-fees {
   transform: unset;
 }
}

@media only screen and (max-width: 56.25em) {
 .heading-secondary {
   font-size: 4.8rem;
 }
}

@media only screen and (max-width: 43.75em) {
  .section-offer {
    grid-template-columns: 1fr;
  }

  .section-offer .card {
    grid-column: 1 / -1;
 }
}