@import url("https://fonts.googleapis.com/css?family=Poppins:600&display=swap");
@import url("https://fonts.googleapis.com/css?family=Inter:400&display=swap");

.wrapper {
   position: relative;
   overflow: hidden;
   min-height: 100%;
}

.page {
   height: 100vh;
   position: relative;
   z-index: 1;
   display: flex;
   align-items: flex-end;
   justify-content: center;
}
.page__container {
   max-width: 56.25rem;
   padding: 1.875rem 0.9375rem 0 0.9375rem;
   color: #FFF;
   position: relative;
   z-index: 3;
   text-align: center;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
   gap: 17rem;
}
.page__title {
   font-family: "Poppins";
   font-size: 12rem;
   font-weight: 600;
   line-height: 0.86em; 
   letter-spacing: 0.24rem;
}
.page__link {
   font-family: Inter;
   font-weight: 400;
   font-size: 2rem;
   padding: 3.1875rem 7.375rem;
   border: 0.0625rem solid #fff;
   border-radius: 1.25rem 1.25rem 0 0;
   transform: translateY(0.1875rem);
   background: rgba(255, 255, 255, 0.35);
}
.page__link:hover{
   background-color: rgba(255, 255, 255, 0.2);
   transition: background-color 0.3s ease;
}
.page__logo {
   position: absolute;
   right: 3.5%;
   bottom: 5%;
   width: 4.875rem;
   height: 4.875rem;
}
.page__logo img{
   max-width: 100%;
}

.page__background{
   position: absolute;
   z-index: -1;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   filter: blur(3.125rem);
}

@media(max-width: 1440px){
   .page__title{
      font-size: 9rem;
   }
}
@media(max-width: 767.98px){
   .page__title{
      font-size: 6.25rem;
   }
   .page__link{
      padding: 1.875rem 2.5rem;
      font-size: 1.25rem;
   }
   .page__logo{
      width: 3.125rem;
      height: 3.125rem;
   }
}
@media(max-width: 450px){
   .page__title{
      font-size: 3.75rem;
   }
   .page__link{
      padding: 1.25rem;
      font-size: 1.125rem;
   }
   .page__logo{
      width: 3rem;
      height: 3rem;
   }
}