@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Montserrat:wght@500;700&display=swap");
@import './cf7-custom.css';
.page-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background-color: #f6e9f0;
  background-image: url("../images/bg.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: "Montserrat", sans-serif;
}

.page-container {
  display: flex;
  justify-content: center;
}
.page-container .col {
  width: 585px;
  display: flex;
  align-items: center;
}

.content {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(5, min-content);
}
.content__logo {
  display: flex;
  justify-content: center;
}
.content__logo img {
  width: 300px;
  height: 100%;
}
.content__headling {
  display: flex;
  justify-content: center;
}
.content__headling h1 {
  font-size: 38px;
  font-family: "DM Serif Display", serif;
  text-align: center;
}
.content__image {
  display: flex;
  justify-content: center;
}
.content__image img {
  width: 300px;
  height: 100%;
}
.content__lead {
  display: flex;
  justify-content: center;
}
.content__lead h2 {
  font-size: 28px;
  font-family: "DM Serif Display", serif;
  color: #c094a3;
  text-align: center;
}
.content__form input[type=text], .content__form input[type=email] {
  border: none;
}
.content__form input[type=text]:focus, .content__form input[type=email]:focus {
  outline-color: #c094a3;
}
.content__form input[type=text]:focus-visible, .content__form input[type=email]:focus-visible {
  outline-color: #c094a3;
}

.phone {
  width: 100%;
}
.phone__frame {
  background-image: url("../images/phone-frame.webp");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 551px;
  min-width: 280px;
}
.phone__frame__slider {
  position: relative;
}
.phone__frame__slider .swpier {
  position: absolute;
}
.phone__frame__slider .slider-img {
  position: absolute;
  top: 50px;
  left: 0;
}

@media only screen and (max-width: 1200px) {
  .page-container .col {
    width: 480px;
  }
}
@media only screen and (max-width: 992px) {
  .page-wrapper {
    height: auto;
  }
  .page-container {
    flex-direction: column;
    padding: 16px 32px 48px 32px;
  }
  .page-container .col {
    width: 100%;
  }
  .content__logo img {
    width: 220px;
  }
  .content__image img {
    width: 160px;
  }
}/*# sourceMappingURL=page-gift.css.map */