:root {
  --bg-dark: #1f060e;
  --lyf-primary: #fe6b70;
  --padding-page: clamp(1.375rem, 3.5vw, 4rem);
  --reset-padding-page: calc(-1 * var(--padding-page, 2rem));
  --primary: #ffead4;
}

.landing-page {
  background-color: var(--bg-dark, black);
  color: var(--primary, white);
  padding: var(--padding-page, 4rem);
  font-size: clamp(1.25rem, 1.7vw, 2rem);
  font-weight: 300;
}

section {
  margin-bottom: clamp(5.25rem, 5.5vw, 6.5rem);
}

h2 {
  font-size: clamp(2.25rem, 2.5vw, 3.125rem);
  font-weight: 400;
}

header {
  min-height: calc(100dvh - (2 * var(--padding-page, 4rem)));
  background-image: url("../images/header.png");
  background-position: center;
  background-size: cover;
  margin-bottom: clamp(4rem, 5.5vw, 6.5rem);
}
header h1 {
  margin: 0 2rem;
  max-width: 70rem;
  font-size: clamp(1.5rem, 2.5vw, 3rem);
}
header img {
  width: clamp(6.5rem, 11.5vw, 14rem);
}

@media (width >= 48rem) {
  #services {
    flex-direction: row;
    align-items: start;
  }
  #services img {
    min-width: 45%;
  }
}

#b2c .grid > * {
  background-position: center;
  background-size: cover;
  aspect-ratio: 80 / 100;
  padding: clamp(2.25rem, 2.9vw, 3.5rem) clamp(2rem, 2.5vw, 4rem);
}
@media (width >= 48rem) {
  #b2c .grid {
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  }
}
.faq {
  background:
    linear-gradient(
      359.62deg,
      #4c2937 0.32%,
      rgba(87, 51, 66, 0.782898) 21.82%,
      rgba(178, 96, 129, 0) 99.68%
    ),
    url("../images/faq.png");
}
.contact {
  background: url("../images/contact.png");
}
.additional {
  font-size: clamp(0.625rem, 1vw, 1.25rem);
  line-height: normal;
}
.android {
  background: url("../images/android.png");
}
a.button-like {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  border: var(--primary) solid 2px;
  border-radius: 2.25rem;
  color: var(--primary, white);
  font-size: clamp(0.75rem, 1vw, 1.25rem);

  &::after {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 1rem;
    background: url("../icons/arrow_right.svg") no-repeat bottom;
    background-size: contain;
  }
}

footer {
  margin:
    0
    var(--reset-padding-page, 2rem)
    var(--reset-padding-page, 2rem)
    var(--reset-padding-page, 2rem);
  min-height: 45rem;
  border-radius: 35rem 35rem 0 0;
  background-image: url("../images/footer.png");
  background-position: center;
  background-size: cover;
}
footer img {
  width: clamp(5.5rem, 7.1vw, 8.5rem);
}
footer .links {
  gap: clamp(2rem, 4vw, 4.75rem)
}
@media (width >= 48rem) {
  footer .links {
    flex-direction: row;
  }
}