Young

<section>
            <div class="wrapper">
                <div class="main">
                    <div class="main-text">
                        <p class="main-text__plan">PLAN YOUR LIFE</p>
                        <h1 class="main-text__head">Increase your <span class="main-text__head-bold">productivity</span></h1>
                        <p class="main-text__niz">Brute laoreet efficiendi id his, ea illum nonumes luptatum pro. Usu <br>
                             atqui laudem an, insolens gubergren similique est cu. Et vel modus <br>
                              congue vituperata.
                        </p>
                        <div class="main-text__play">
                            <div class="main-text__play-tringle">
                                
                            </div>
                        </div>
                        <div class="main-circle">
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                            <div class="main-circle__item"></div>
                        </div>  
                    </div>
                    <div class="main-lines"></div>
                </div>
            </div>
        </section>

.main {
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   margin: 0 auto;
   margin-top: 19px;
   background: linear-gradient(180deg, #F4F7FF 0%, #F1F5FF 100%);
   border: 1px solid #D8E3FE;
   max-width: 1441px;
}
 
.main-text {
   padding-top: 92px;
   padding-bottom: 284px;
}
 
.main-text__play{
   margin-top: 20px;
   border-radius: 50%;
   width: 52px;
   height: 52px;
   background: #FFFFFF;
   box-shadow: 0px 10px 50px rgba(201, 209, 231, 0.6);
   display: inline-block;
   position: relative;
}
.main-text__play-tringle{
   width: 10px;
   height: 11px;
   border-top: 6px solid transparent;
   border-left: 10px solid #5E81FF;
   border-bottom: 6px solid transparent;
   display: inline-block;
   position: relative;
   top: 20px;
   left: 2px;
}
.main-circle{
   
}
.main-circle__item:nth-child(1) {
   position: absolute;
    width: 45px;
   height: 23px;
   left: 253px;
   top: 172px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(2) {
   position: absolute;
   width: 74.5px;
   height: 76px;
   left: 0.5px;
   top: 256px;
   background: #fff;
   border-radius: 0 100% 0 0 / 0 100% 0 0; 
}
.main-circle__item:nth-child(3) {
   position: absolute;
   width: 19.78px;
   height: 10.18px;
   left: 307.22px;
   top: 466px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(4) {
   position: absolute;
   width: 23.44px;
   height: 11.95px;
   left: 253px;
   top: 478.48px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0; 
}
.main-circle__item:nth-child(5) {
   position: absolute;
   width: 49.64px;
   height: 24.82px;
   left: 261.27px;
   top: 476.18px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(6) {
   position: absolute;
   width: 32.63px;
   height: 16.55px;
   left: 294.37px;
   top: 484.45px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(7) {
   position: absolute;
   width: 103.47px;
   height: 51.81px;
   left: 1085px;
   top: 557.19px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(8) {
   position: absolute;
   width: 47.37px;
   height: 24.08px;
   left: 1158px;
   top: 545px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0; 
}
.main-circle__item:nth-child(9) {
   position: absolute;
   width: 68.02px;
   height: 34.54px;
   left: 1171px;
   top: 574.46px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0; 
}
.main-circle__item:nth-child(10) {
   position: absolute;
   width: 45px;
   height: 23px;
   left: 1257px;
   top: 166px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(11) {
   position: absolute;
   width: 77.81px;
   height: 39px;
   left: 1224px;
   top: 133px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.main-circle__item:nth-child(12) {
   position: absolute;
   width: 31px;
   height: 16px;
   left: 1208px;
   top: 117px;
   background: #fff;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0; 
}
.main-circle__item:nth-child(13) {
   position: absolute;
   width: 74.5px;
   height: 76px;
   left: 1404px;
   top: 430px;
   background: #fff;
   border-radius: 100% 0 0 0 / 100% 0 0 0; 
}
 
 
.main-text__plan {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 500;
   font-size: 10px;
   line-height: 12px;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   color: #3D4F9F;
}
 
.main-text__head {
   font-family: 'Quicksand';
   font-style: normal;
   font-weight: 300;
   font-size: 48px;
   line-height: 60px;
   text-align: center;
   color: #3D4F9F;
   padding-top: 16px;
   padding-bottom: 28px;
}
.main-text__head-bold{
   font-weight: 500;
}
 
.main-text__niz {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 400;
   font-size: 15px;
   line-height: 29px;
   text-align: center;
   letter-spacing: 0.03em;
   color: #8D96BD;
}
.main-lines{
   background-image: url(../../img/lines.svg);
   width: 1141px;
   height: 400px;
}