@import url("https://fonts.googleapis.com/css?family=Poppins:regular,700&display=swap");


body{
   font-family: "Poppins", sans-serif;
}
.wrapper {
   position: relative;
   overflow: hidden;
   min-height: 100%;
}
.page {
   position: relative;
   height: 100vh;
   background-color: #f0c101;
   display: flex;
   justify-content: center;
   align-items: center;
}

.page__container {
   position: relative;
   height: 100%;
   /* max-width: 2112px; */
   display: flex;
   padding: 11.0625rem 9.625rem 3.875rem 0.9375rem;
   justify-content: center;
}
.page__image {
   flex: 0 1 704px;
   position: relative;
   max-width: 704px;
   aspect-ratio: 1 / 1;
   z-index: 3;
   display: flex;
   align-items: center;
   justify-content: center;
}
.page__image img{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: contain;
}
.page__image::after{
   content: "";
   position: absolute;
   z-index: -1;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   max-width: 704px;
   max-height: 704px;
   background-color: #a77502;
   border-radius: 50%;
   transform: translate(-6%, 16%);
}
.page__block {
   flex: 0 1 704px;
   position: relative;
   z-index: 5;
   display: flex;
   flex-direction: column;
   gap: 0.9375rem;
   justify-content: space-between;
   transform: translateX(33%);
}

.page__title,
.page__title-soon{
   color: #FFF;
   font-size: 10.125rem;
   font-weight: 700;
   line-height: 0.53em; 
}
.page__link {
   color: #000;
   font-size: 1.375rem;
   line-height: 3.9em; 
}
.page__link:hover{
   text-decoration: underline;
}
.page__title-soon {
   align-self: flex-end; 
   padding-bottom: 12rem;
   transform: translateX(-17%);
   position: relative;
   z-index: 2;
}
@media(max-width: 1570px){
   .page__title,
   .page__title-soon{
      font-size: 7rem;
   }
   .page__title-soon {
      transform: translateX(-23%);
      padding-bottom: 20rem;
   }
   .page__block{
      transform: translateX(43%);
      padding-top: 5%;
   }
   .page__image{
      max-width: 503px;
      max-height: 503px;
   }
   .page__image::after{
      max-width: 503px;
      max-height: 503px;
      transform: translate(-2%, 7%);
   }
}
@media(max-width: 1070px){
   .page__title,
   .page__title-soon{
      font-size: 5rem;
   }
   .page__title-soon {
      transform: translateX(-45%);
   }
   .page__block{
      transform: translateX(70%);
      padding-top: 5%;
   }
   .page__image{
      max-width: 503px;
      max-height: 503px;
   }
   .page__image::after{
      max-width: 503px;
      max-height: 503px;
   }
}
@media(max-width: 767.98px){
   .page__container{
      flex-direction: column-reverse;
      gap: 3.75rem;
      justify-content: space-between;
      align-items: center;
      padding: 5.875rem 0.9375rem 3.875rem 0.9375rem;
   }
   .page__title,
   .page__title-soon{
      font-size: 4rem;
   }
   .page__title-soon {
      transform: translateX(0);
      padding-bottom: 0;
      align-self: center; 
   }
   .page__block{
      transform: translateX(0);
      padding-top: 0;
   }
   .page__image{
      max-width: 303px;
      max-height: 303px;
   }
   .page__image::after{
      max-width: 303px;
      max-height: 303px;
     
   }
   .page__link{
      font-size: 1.125rem;
   }
}