.stack { font-family: "GT Eesti Pro Display"; &__container { margin: 0 auto; padding: 85px 0 90px; max-width: 1020px; position: relative; display: flex; } &__intro { background: #EEEEEE; .intro { &__container { background-image: url("../../assets/images/backgroundLandingIntro.svg"); background-repeat: no-repeat; background-position: center bottom; } &__info { display: flex; flex-direction: column; position: relative; z-index: 2; } &__suptitle { font-weight: 700; font-size: 16px; color: #838383; } &__title { font-weight: 900; color: #A7CA60; font-size: 88px; text-transform: uppercase; letter-spacing: 0.03em; margin: 39px 0 6px; z-index: 2; } &__subtitle { letter-spacing: 0.05em; font-size: 39px; font-weight: 700; color: #4A4A4A; } &__about { max-width: 380px; color: #4A4A4A; font-size: 14px; font-weight: 250; margin-bottom: 34px; span { font-weight: 400; } } &__links { display: flex; column-gap: 30px; align-items: center; } &__link { font-weight: 700; font-size: 12px; color: #A7CA60; } &__ellipse { z-index: 1; top: 45%; left:50%; transform:translate(-50%, -50%); position: absolute; } &__aside { position: relative; border-radius: 24px 0 113px 0; top: 55px; width: 330px; height: 517px; background: rgba(167, 202, 96, 0.7); margin-left: 96px; z-index: 1; &:before { content: ""; width: 182px; height: 106px; position: absolute; backdrop-filter: blur(8.699999809265137px); box-shadow: 10px 9px 14px 0 rgba(0, 0, 0, 0.06); background: linear-gradient(137deg, rgba(255, 255, 255, 0.34) 0%, rgba(206, 198, 198, 0.34) 100%); border-radius: 8px; top: -35px; left: -25px; z-index: 3; } .aside { &__logo { z-index: 2; font-family: 'Geraspoheko'; color: white; font-size: 343px; position: absolute; line-height: 325.92px; left: 80px; top: -30px; } &__clue { position: absolute; backdrop-filter: blur(8.699999809265137px); box-shadow: 10px 9px 14px 0 rgba(0, 0, 0, 0.03); background: linear-gradient(137deg, rgba(255, 255, 255, 0.34) 0%, rgba(206, 198, 198, 0.34) 100%); border-radius: 8px; width: 182px; height: 106px; bottom: 35px; right: -140px; z-index: 2; display: flex; padding: 24px 20px 18px 30px; border: 0.5px solid; border-image-source: linear-gradient(137.79deg, #FFFFFF 9.15%, #F4F4F4 76.22%); p { color: rgba(141, 141, 141, 1); font-size: 14px; font-weight: 300; letter-spacing: 0.03em; line-height: 15.96px; span { font-weight: 700; } } img { position: absolute; top: -25px; left: 0 ; } &:before { position: absolute; content: "Подсказка"; font-weight: 700; color: rgba(205, 205, 205, 1); font-size: 14px; line-height: 19.18px; letter-spacing: 0.03em; top: -22px; right: 10px; } } &__cat { position: absolute; z-index: 3; bottom: 0; left: -125px; } } } } } &__button { max-width: 200px; width: 100%; background: #A7CA60; font-size: 15px; color: #4A4A4A; padding: 14px 0; border-radius: 44px; border: none; } &__opportunity { background: #1E1E1E; position: relative; .background__opportunity--left { position: absolute; top: -50%; left: -5%; } .background__opportunity--right { position: absolute; bottom: 0; right: 0; } .opportunity { &__container { padding: 105px 0 0px; flex-direction: column; } &__code { position: absolute; top: 35px; left: 55px; &--center { position: absolute; right: 31%; top: 34%; } } &__block { display: flex; } &__title { font-family: 'Geraspoheko'; font-weight: 400; font-size: 343px; line-height: 1.03; margin-bottom: 0; z-index: 2; background: linear-gradient(360deg, #171717 0%, #2a2a2a 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent } &__info { display: flex; flex-direction: column; margin-left: 15px; .info { &__subtitle { padding-left: 31px; color: rgba(167, 202, 96, 1); font-weight: 700; font-size: 14px; line-height: 16.24px; margin-bottom: 30px; } &__about { padding-left: 31px; font-size: 14px; color: rgba(238, 238, 238, 1); line-height: 19.18px; font-weight: 250; max-width: 355px; margin-bottom: 27px; span { font-weight: 400; } } &__notification { padding: 21px 19px 23px 31px; border-radius: 8px; backdrop-filter: blur(8.699999809265137px); box-shadow: 10px 9px 14px 0 rgba(0, 0, 0, 0.06); background: linear-gradient(137deg, rgba(87, 87, 87, 0.34) 0%, rgba(104, 104, 104, 0.34) 100%); position: relative; border: 0.5px solid #717171; img { position: absolute; width: 80.93px; height: 74.19px; left: -68px; top: -10px; } p { color: rgba(238, 238, 238, 1); line-height: 19.18px; font-size: 14px; } } } } &__subjects { display: flex; column-gap: 100px; position: relative; top: -100px; z-index: 3; right: -35px; .subject { display: flex; flex-direction: column; h4 { color: rgba(167, 202, 96, 1); letter-spacing: 0.03em; font-weight: 900; font-size: 88px; line-height: 86.58px; margin-bottom: 0; } &__skills { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 20px; span { border: 0.5px solid rgba(167, 202, 96, 0.5); border-radius: 56px; padding: 8px 25px 8px; color: rgba(167, 202, 96, 1); font-size: 17px; line-height: 20.88px; } } } } } } }