.hero-section {
  background: radial-gradient(108.71% 40.11% at 61.02% 54.61%, #fff 0%, #cfd3dc 100%);
  overflow: hidden;
  margin: 0 auto;
  padding-bottom: clamp(3.125rem, 5.637vw + 1.74rem, 6.25rem);
}
@media screen and (min-width: 768px) {
  .hero-section {
    padding-bottom: 0;
  }
}

.hero-box {
  position: relative;
}
@media screen and (min-width: 768px) {
  .hero-box {
    display: flex;
    justify-content: space-between;
  }
}

.hero-content {
  padding-top: clamp(1.25rem, 0.789vw + 1.056rem, 1.688rem);
}
@media screen and (min-width: 768px) {
  .hero-content {
    height: clamp(47.625rem, 44.813rem + 5.859vw, 49.5rem);
  }
}

.hero-content-box {
  display: flex;
  flex-direction: column-reverse;
}
@media screen and (min-width: 768px) {
  .hero-content-box {
    display: block;
  }
}

.hero-title {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: clamp(4.375rem, 12.176vw + 1.384rem, 11.125rem);
  line-height: 90%;
  text-transform: uppercase;
  color: var(--green-hover);
  width: clamp(17.875rem, 5.663rem + 49.718vw, 45.438rem);
  margin-bottom: clamp(0.5rem, 3.495vw - 0.358rem, 2.438rem);
}

.hero-text p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: clamp(1rem, 1.804vw + 0.557rem, 2rem);
  line-height: 120%;
  color: #000;
  width: clamp(21.375rem, 17.498rem + 15.784vw, 30.125rem);
}
.hero-text p span {
  color: #46a29f;
}
@media screen and (max-width: 393px) {
  .hero-text p {
    width: 280px;
  }
}
@media screen and (min-width: 675px) {
  .hero-text p {
    width: 335px;
  }
}
@media screen and (min-width: 926px) {
  .hero-text p {
    width: 405px;
  }
}
@media screen and (min-width: 1180px) {
  .hero-text p {
    width: 445px;
  }
}
@media screen and (min-width: 550px) {
  .hero-text p {
    margin-bottom: 28px;
  }
}

.hero-holder {
  animation: floatCloud 25s cubic-bezier(0.445, 0.05, 0.55, 0.95) infinite;
}
@media screen and (min-width: 768px) {
  .hero-holder {
    display: block;
    position: relative;
    left: clamp(7.375rem, -25.813rem + 69.141vw, 29.5rem);
    bottom: clamp(5.625rem, -16.875rem + 46.875vw, 20.625rem);
  }
}

.hero-bg-parallax {
  background-image: url("/wp-content/themes/papa-holder/assets/img/hero-cloud-desk-1x.webp'");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  max-width: 622px;
}
@media screen and (min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
  .hero-bg-parallax {
    background-image: url("/wp-content/themes/papa-holder/assets/img/hero-cloud-desk-2x.webp'");
  }
}
@media screen and (min-width: 1280px) {
  .hero-bg-parallax {
    background-image: url("/wp-content/themes/papa-holder/assets/img/hero-cloud-desk-1x.webp'");
  }
}
@media screen and (min-width: 1280px) and (min-device-pixel-ratio: 2), screen and (min-width: 1280px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 1280px) and (min-resolution: 192dpi), screen and (min-width: 1280px) and (min-resolution: 2dppx) {
  .hero-bg-parallax {
    background-image: url("/wp-content/themes/papa-holder/assets/img/hero-cloud-desk-2x.webp'");
  }
}

.hero-holder-img {
  width: clamp(14.688rem, 14.431vw + 11.143rem, 22.688rem);
  display: block;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media screen and (min-width: 550px) {
  .hero-holder-img {
    bottom: 50px;
  }
}
@media screen and (min-width: 1280px) {
  .hero-holder-img {
    bottom: 50px;
  }
}

.hero-image {
  width: -moz-max-content;
  width: max-content;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 36px;
  border-radius: 12px;
  width: 205px;
  height: 331px;
  box-shadow: 7px 4px 15px 0 rgba(0, 0, 0, 0.15);
  background: var(--black-default);
  background-image: url("/wp-content/themes/papa-holder/assets/img/bg-image-item-1x.webp'");
  background-position: center;
  background-size: auto;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .hero-image {
    width: 357px;
    height: 331px;
    padding-top: 21px;
  }
}
@media screen and (max-width: 393px) {
  .hero-image {
    width: 280px;
    height: 331px;
    padding-top: 21px;
  }
}
@media screen and (min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
  .hero-image {
    background-image: url("/wp-content/themes/papa-holder/assets/img/bg-image-item-2x.webp'");
  }
}

.hero-button-box {
  z-index: 2;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .hero-button-box {
    width: 357px;
    max-width: 357px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 393px) {
  .hero-button-box {
    width: 280px;
  }
}
@media screen and (min-width: 768px) {
  .hero-button-box {
    position: absolute;
    top: clamp(1.25rem, 0.789vw + 1.056rem, 1.688rem);
    right: clamp(1.778rem, 2.255vw + 0.696rem, 2.5rem);
    display: flex;
    flex-direction: column-reverse;
    gap: 30px;
    padding: 0;
    justify-content: flex-end;
  }
}

.hero-button {
  font-family: var(--font-family);
  font-weight: 400;
  font-size: 18px;
  line-height: 130%;
  color: var(--black-defauld);
  border-radius: 12px;
  padding: 30.5px 37px;
  width: 243px;
  height: 84px;
  border: none;
  background-color: var(--green-default);
  transition: background-color var(--time-function), color var(--time-function);
}
.hero-button:hover {
  background-color: var(--green-hover);
  color: var(--white-default);
}
@media screen and (max-width: 767px) {
  .hero-button {
    display: block;
    margin: 0 auto 50px;
  }
}
@media screen and (min-width: 768px) {
  .hero-button {
    width: 205px;
    padding: 30.5px 18px;
  }
}

.hero-neck-img {
  width: 205px;
}
@media screen and (max-width: 767px) {
  .hero-neck-img {
    width: 100%;
  }
}

.hero-text-img {
  padding: 0 14px;
}
@media screen and (max-width: 767px) {
  .hero-text-img {
    display: flex;
  }
}
@media screen and (max-width: 393px) {
  .hero-text-img {
    display: block;
  }
}
.hero-text-img p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: 22px;
  line-height: 120%;
  text-align: center;
  color: var(--white-default);
}
.hero-text-img p:not(:last-child) {
  margin-bottom: 36px;
}
@media screen and (max-width: 767px) {
  .hero-text-img p:not(:last-child) {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 393px) {
  .hero-text-img p:not(:last-child) {
    margin-bottom: 36px;
  }
}

.socials-section {
  position: fixed;
  bottom: 20px;
  z-index: 1000;
  right: clamp(1.25rem, 2.255vw + 0.696rem, 2.5rem);
}

.socials-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

@keyframes floatCloud {
  0% {
    transform: translate(0px, 0px) scale(1);
  }
  10% {
    transform: translate(10px, -6px) scale(1.01);
  }
  20% {
    transform: translate(20px, -3px) scale(1.02);
  }
  30% {
    transform: translate(30px, 0px) scale(1.01);
  }
  40% {
    transform: translate(25px, 4px) scale(1);
  }
  50% {
    transform: translate(20px, 8px) scale(0.99);
  }
  60% {
    transform: translate(10px, 4px) scale(1);
  }
  70% {
    transform: translate(0px, 0px) scale(1.01);
  }
  80% {
    transform: translate(-10px, -4px) scale(1.02);
  }
  90% {
    transform: translate(-20px, -6px) scale(1.01);
  }
  100% {
    transform: translate(0px, 0px) scale(1);
  }
}
/*# sourceMappingURL=hero-section.css.map */
