@font-face {
   font-family: "BethanyElingston";
   src: url("../fonts/BethanyElingston.woff2") format('woff2');
   font-display: swap;
   font-weight: 400;
   font-style: normal;
}

@font-face {
   font-family: 'AbroSans';
   src: url('../fonts/AbroSans Thin.woff2') format('woff2');
   font-weight: 100;
   font-style: normal;
   font-display: swap;
 }
 

.wrapper {
   position: relative;
   overflow: hidden;
   min-height: 100%;
}
.page {
   position: relative;
   height: 100vh;
   align-content: center;
}
.page__container {
   margin: 0 auto;
   margin-top: 4.6875rem;
   max-width: 92.625rem;
   padding: 0.9375rem;
   position: relative;
   z-index: 2;
   display: flex;
   flex-direction: column;
   gap: 2.125rem;
}
.page__title {
   color: #2D2D2D;
   font-family: "BethanyElingston";
   font-size: 12.9375rem;
   font-weight: 400;
   line-height: 119.324%; 
   letter-spacing: 0.905625rem;
   max-width: 40%;
}
.page__link {
  color: #2D2D2D;
  font-family: 'AbroSans';
  font-size: 2rem;
  font-weight: 100;
  letter-spacing: 0.14rem;
  padding: 1.125rem 2.75rem;
  border-radius: 12.5rem;
  border: 0.0625rem solid #000;
  align-self: flex-start;
}
.page__link:hover{
   color: rgba(45, 45, 45, 0.7);
   border: 0.0625rem solid rgba(45, 45, 45, 0.7);
   transition: all 0.5s ease ;
}
.page__background {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.page__background img{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover; 
}
@media(max-width: 1366px){
   .page__title{
      font-size: 6.25rem;
   }
   .page__link{
      font-size: 1.5rem;
   }
}
@media(max-width: 675px){
   .page__title{
      font-size: 2.625rem;
   }
   .page__link{
      font-size: 1rem;
      padding: 0.9375rem;
   }
}