#komu-podoydet {
    width: 100%;
    max-width: 1400px;
    display: flex;
    min-height: 650px;
    margin: auto;
    flex-direction: column;

}

@media (max-width: 1240px) {
    #komu-podoydet {
        height: auto;
    }
}

.socialll {
  width: 40px;
  height: 40px;
}
#komu-podoydet > h2 {
    width: 407px;
    height: 76px;
    background-image: url('./text-2.svg');
    background-position: 0 0;
    background-size: contain;
    background-repeat: no-repeat;
    color: transparent;

    margin-top: 100px;
}

#komu-podoydet > p {
  font-family: Montserrat;
  font-weight: 400;
  font-style: Regular;
  font-size: 24px;
  leading-trim: NONE;
  line-height: 120%;
  letter-spacing: 0%;
  

margin-top: 30px;
width: 670px;
height: 87px;

color: #414141;
}

#komu-podoydet > aside {
    /* background-image: url('./7778.png'); */
    width: 100%;
    height: 410px;
    display: flex;
    align-items: start;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 50px;
}


#komu-podoydet > aside > div > img {
  width: 120px;
}
#komu-podoydet > aside > div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 20px;
}

#komu-podoydet > aside > div > p {
  font-family: Montserrat;
  font-weight: 500;
  font-style: Medium;
  font-size: 18px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  text-align: center;
  

color: #414141;
}
#komu-podoydet > aside > div:nth-child(1) > img {
  width: 130px;
  height: 127px;
}


#komu-podoydet > aside > div:nth-child(1)  {
  width: 297px;
  height: 169px;
}

#komu-podoydet > aside > div:nth-child(2)  {
  width: 372px;
  height: 184px;
}

#komu-podoydet > aside > div:nth-child(3)  {
  width: 302px;
  height: 183px;

}

#komu-podoydet > aside > div:nth-child(4)  {
  width: 239px;
  height: 157px;
}

#komu-podoydet > aside > div:nth-child(5)  {
  width: 356px;
  height: 174px;
}

#komu-podoydet > aside > div:nth-child(6)  {
  width: 173px;
  height: 162px;
}
#komu-podoydet > aside > div:nth-child(7)  {
  width: 320px;
  height: 189px;

}

#komu-podoydet > aside > div:nth-child(8)  {
  width: 363px;
  height: 188px;
}





#esli-vam-eto-meshaet {

    width: 100%;
    max-width: 1533px;
    height: 895px;
    margin: 100px auto 0px auto;
    background-image: url('./fff.webp');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0;

    position: relative;
    border-radius: 30px;

    

}


#esli-vam-eto-meshaet > img {
  position: absolute;
  /* right: 25px;
  bottom: 10%;
  height: auto;
  width: 43%; */
  /* width: 660px; */

  width: 44%;
  max-width: 692px;
  bottom: 55px;
  right: 70px;
}


#esli-vam-eto-meshaet > h2 {
  width: 454px;
  height: 76px;
  /* background-image: url('./text-009.svg'); */
  background-size: contain;
  background-position: 0 0;
  background-repeat: no-repeat;
  color: transparent;
  margin-top: 25px;
  margin-left: 5px;
  
}

#esli-vam-eto-meshaet > ul {
  display: flex;
  align-items: start;
  justify-content: start;
  gap: 20px;
  flex-direction: column;
  margin-left: 85px;
  width: 746px;
  height: 635px;

  margin-top: 85px;
}
#rezultati-uroka > aside > span > a > img {
  width: 199px;
  height: 66px;
}
#esli-vam-eto-meshaet > ul > li {
  font-size: 25px;

  font-family: Montserrat;
  font-weight: 400;
  font-style: Regular;
  font-size: 28px;
  leading-trim: NONE;
  line-height: 120%;
  letter-spacing: 0%;
  padding-left: 8px;
  

}

#esli-vam-eto-meshaet > ul > li::marker {
  font-size: 0.5em;
}

#esli-vam-eto-meshaet > ul > li:nth-child(1) {
  width: 387px;

}
#esli-vam-eto-meshaet > ul > li:nth-child(2) {
  width: 404px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(3) {
  width: 610px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(4) {
  width: 606px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(5) {
  width: 450px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(6) {
  width: 497px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(7) {
  width: 553px;
  
}
#esli-vam-eto-meshaet > ul > li:nth-child(8) {
  width: 634px;
  
}

#rezultati-uroka {
    width: 100%;
    max-width: 1420px;
    min-height: 990px;
    margin: 120px auto 0px auto;

}

#rezultati-uroka > h2 {
    width: 484px;
    height: 76px;
    background-image: url('./text-3.svg');
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
    color: transparent;


}

.grid {

    margin-top: 60px;
    display: grid;
    grid-template-columns: repeat(3, 463px); /* 3 колонки */
    width: 1410px;
    grid-gap: 10px; /* расстояние между карточками */
  }

  .grid img {
    width: 463px;
    height: 209px;
    object-fit: cover; 
    display: block;
  }

  .grid div {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  @media (min-width: 1240px) {
    .grid div.mobile {
      display: none;
    }
  }

  .grid div p {
    font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 22px;
leading-trim: NONE;
line-height: 110%;
letter-spacing: 0%;
text-align: center;

  }
  .grid .a1 {
    background-image: url('./11.svg');
    width: 463px;
    height: 209px;
    /* padding-top: 59px; */
  }

  .grid .a2 {
    background-image: url('./22.svg');
    width: 463px;
    height: 209px;
    /* padding-top: 69px; */
  }

  .grid .a3 {
    background-image: url('./33.svg');  
    width: 463px;
    height: 209px;
    /* padding-top: 32px; */
  }

  .grid .a4 {
    background-image: url('./44.svg');
    width: 463px;
    height: 209px;
    /* padding-top: 59px; */
  }

  .grid .a5 {
    background-image: url('./55.svg');
    width: 463px;
    height: 209px;
    /* padding-top: 69px; */
  }

  .grid .a6 {
    background-image: url('./66.svg');
    width: 463px;
    height: 209px;
    /* padding-top: 73px; */
  }



  .grid .a1 > p {
    width: 355px;
    text-align: center;
  }
  .grid .a2 > p {
    text-align: center;
    width: 307px;
  }
  .grid .a3 > p {
    text-align: center;
    width: 386px;
  }
  .grid .a4 > p {
    text-align: center;
    width: 393px;
  }
  .grid .a5 > p {
    text-align: center;
    width: 377px;
  }
  .grid .a6 > p {
    text-align: center;
    width: 269px;
  }






  .grid img.mobile {
    display: none;
  }

  @media (max-width: 1240px) {
    .grid img.mobile {
     display: block;
    }
  }

  #rezultati-uroka > aside {
    width: 100%;
    height: 383px;
    margin: 35px auto 0px auto;

  }

  #rezultati-uroka > aside {
    background-image: url('./section-4.svg');
    background-position: center;
    background-size: cover;
    border-radius: 30px;

    background-repeat: no-repeat;
  }

  #prepodavatel-kursa {
    width: 100%;
    max-width: 1400px;
    margin: 100px auto 0px auto;

    aspect-ratio: 1400 / 1111;/* высота подтягивается от ширины автоматически */
    max-height: 1111px;
    
    background-image: url('./section-55.webp');
    position: relative;

    background-size: contain;
    background-repeat: no-repeat;
    padding: 0;
  }


  #prepodavatel-kursa > a:nth-child(1) {
    background-image: url('./btn-1.svg');
    width: 280px;

    height: 57px;
    display: flex;
    position: absolute;
    left: 78px;
    top: 484px;
    background-repeat: no-repeat;
    color: transparent;
    background-size: contain;

  }

  #prepodavatel-kursa > a:nth-child(2) {
    background-image: url('./btn-2.svg');
    width: 280px;
    background-repeat: no-repeat;
    position: absolute;
    display: flex;
    height: 57px;
    left: 382px;
    top: 484px;

    background-size: contain;
    color: transparent;
  }


  #rezultati-uroka h3 {
    background-image: url('./text-4.svg');
    width: 489px;
    height: 56px;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
    color: transparent;
  }

  #rezultati-uroka > aside {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: column;
    padding-top: 30px;
  }

  #rezultati-uroka > aside > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 829px;
    height: 66px;
    gap: 430px;
    margin-top: 67px;
  }

  #rezultati-uroka > aside > a {
    margin-top: 45px;
    width: 655px;
    height: 80px;
    border-radius: 20px;
    background-color: #2743FB;

    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;

  }

  #rezultati-uroka > aside > a > p {
    font-family: Montserrat;
font-weight: 600;
font-style: SemiBold;
font-size: 22px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
margin-right: 50px;
  }

  #rezultati-uroka > aside > a > img {
    position: absolute;
    width: 38px;
    height: 79px;
    right: 48px;
    top: 0;

  }


  .p-1 {
    font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 32px;
leading-trim: NONE;
line-height: 110%;
letter-spacing: 0%;

position: absolute;

width: 594px;
height: 270px;

top: 200px;left: 70px;
  }

  .p-2 {
    font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 28px;
leading-trim: NONE;
line-height: 12 0%;
letter-spacing: 0%;

width: 510px;
height: 146px;
position: absolute;

top: 662px;
left: 30px;
  }

  .p-3 {
    font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 28px;
leading-trim: NONE;
line-height: 120%;
letter-spacing: 0%;


position: absolute;
width: 510px;
height: 74px;

top: 915px;
left: 30px;
  }

  .p-4 {
    font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 28px;
leading-trim: NONE;
line-height: 120%;
letter-spacing: 0%;

width: 665px;
height: 138px;
position: absolute;


top: 878px;
left: 735px;
  }


  .bonus {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 40px auto 0px auto;
    width: 520px;
    height: 86px;
    background-color: #414141;
    border-radius: 15px;

    position: relative;
  }

  @media (max-width: 1400px) {
    .bonus {
    margin: 20px auto 0px auto;
      
    }
  }

  .bonus img {
    position: absolute;
    width: 74px;
    height: 86px;
    right: 20px;
    bottom: 17px;

  }

  .bonus p {
    font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 27px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
margin-right: 64px;
  }


  #kak-prohodyat-uroki {
    width: 100%;
    max-width: 1440px;
    min-height: 1252px;

    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: column;
    margin: 100px auto 0px auto;
  }

  #kak-prohodyat-uroki h2 {
    background-image: url('./text-5.svg');
    width: 526px;
    height: 76px;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
    color: transparent;
  }

  #kak-prohodyat-uroki > p {
    margin-top: 20px;
    width: 97%;
    height: 82px;
    font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 33px;
leading-trim: NONE;
line-height: 110%;
letter-spacing: 0%;
color: #414141;

  }

  #kak-prohodyat-uroki > p > a {
    font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 33px;
leading-trim: NONE;
line-height: 110%;
letter-spacing: 0%;
text-decoration: underline;
text-decoration-style: solid;
text-decoration-offset: 0%;
text-decoration-thickness: 0%;
text-decoration-skip-ink: auto;
color: #172895;
  }


  /* #kak-prohodyat-uroki > div {
    width: 100%;
    min-height: 836px;
    display: flex;
    align-items: start;
    justify-content: start;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 45px;
  }

  #kak-prohodyat-uroki > div > img {
    width: 690px;
    height: 408px;
    object-fit: cover;  
  }

  #kak-prohodyat-uroki > div > img:nth-child(1), #kak-prohodyat-uroki > div > img:nth-child(3) {
    object-position: 100% 100%; 

  }

  #kak-prohodyat-uroki > div > img:nth-child(2), #kak-prohodyat-uroki > div > img:nth-child(4) {
    object-position: 0% 0%; 
  } */


/* Контейнер двух рядов */
#kak-prohodyat-uroki .sliders-desktop{
  width: 100%;
  max-width: 1440px;
  margin-top: 45px;
}

/* Один независимый ряд */
#kak-prohodyat-uroki .slider-row{
  width: 100%;
  height: 408px;
  overflow: hidden;
  position: relative;
}

/* Отступ между рядами = 20px как в макете */
#kak-prohodyat-uroki .slider-row + .slider-row{ margin-top: 20px; }

/* Лента одного ряда */
#kak-prohodyat-uroki .slider-row .track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(100%, 690px); /* ← тянется на всю ширину, но не больше 690px */
  grid-template-rows: 408px;           /* высота карточки */
  gap: 20px;
  will-change: transform;
  transition: transform .4s ease;
}


/* Карточка */
#kak-prohodyat-uroki .slider-row img.desktop{
  width: 100%;
  max-width: 690px;
  height: 408px;
  object-fit: cover;
  display: block;
  cursor: pointer;
  border-radius: 30px; /* если нужен скруглённый угол */
}

#kak-prohodyat-uroki .slider-row.bottom img.desktop, #kak-prohodyat-uroki .mobile-row.bottom img.mobile{
  object-fit:fill;

}



.left-mobile-1, .left-mobile-2, .right-mobile-1, .right-mobile-2, .left-desktop-1, .left-desktop-2, .right-desktop-1, .right-desktop-2 {
  opacity: 0.5;
}



/* На мобильном десктопные ряды скрываем полностью */
/* по умолчанию прячем мобильные ряды */
#kak-prohodyat-uroki .mobile-sliders { display:none; }

/* показываем мобильные ряды только на мобилке */
@media (max-width:1240px){
  #kak-prohodyat-uroki .sliders-desktop{ display:none; }
  #kak-prohodyat-uroki .mobile-sliders{
    display:block;
    width:100%;
    max-width:384px;
    margin:25px auto 0;
  }



  #kak-prohodyat-uroki .mobile-row{
    width:100%;
    height:250px;
    overflow:hidden;
    position:relative;
  }
  #kak-prohodyat-uroki .mobile-row + .mobile-row{ margin-top:10px; }

  /* лента одного мобильного ряда */
  #kak-prohodyat-uroki .mobile-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: min(100%, 384px); /* ← тянется на всю ширину, но не больше 384px */
    grid-template-rows: 223px;           /* высота карточки */
    gap: 10px;
    will-change: transform;
    transition: transform .4s ease;
  }
  #kak-prohodyat-uroki .mobile-row img.mobile{
    width:100%;
    max-width: 384px;
    height: 230px;
    object-fit:cover;
    display:block;
    border-radius:30px;
    cursor:pointer;
  }
}



  #kak-prohodyat-uroki > a {
    width: 645px;
    height: 74px;
    background: #2743FB;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;

    margin: 73px auto 0px auto;

    position: relative;
  }

  #kak-prohodyat-uroki > a > p {
    font-family: Montserrat;
font-weight: 600;
font-style: SemiBold;
font-size: 26px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
margin-right: 30px;
  }
  #kak-prohodyat-uroki > a > img {
    width: 40px;
    height: 83px;
    right: 18px;
    bottom: 0;
    position: absolute;
  }

  #kak-prohodyat-uroki > span {
    display: flex;
    align-items: end;
    justify-content: center;
    margin: 5px auto 0px auto;
    
    width: 192px;
    height: 40px;

    gap: 10px;
  }

  #kak-prohodyat-uroki > span > p {
    font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 18px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
color: #414141;
  }

  #kak-prohodyat-uroki > span > img {
    width: 34px;
    height: 40px;
  }

  footer {
    width: 100%;
    height: 187px;
    margin-top: 55px;
    background: #0F0F11;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 20px;
  }

  footer > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1400px;
  }

  footer > div > p {
    width: 100px;
    height: auto;
    font-family: Montserrat;
font-weight: 600;
font-style: SemiBold;
font-size: 20px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;

  }

  footer > div > a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 20px;
    font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 16px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
color: #b5b5b5;

margin-top: 35px;
  }

  footer > div > div {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
  }

  footer > div > div > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 140px;
    height: 40px;
    gap: 10px;
  }


  @media (max-width: 1440px) {
    .grid {
      grid-template-columns: repeat(2, 463px);
      width: 936px;
      margin: 60px auto 0px auto;
    }
    

    #kak-prohodyat-uroki > div {
      width: 690px;
      margin: 45px auto 0px auto;
    }

    /* #prepodavatel-kursa > a:nth-child(1), #prepodavatel-kursa > a:nth-child(2) {
      top: 500px;
    } */



    /* .p-1 {
      font-size: 32px;
    }
    .p-2 {
      font-size: 29px;
      width: 500px;

      top: auto;
      bottom: 294px;
    }
    .p-3 {
      font-size: 29px;
      top: auto;
      bottom: 80px;
    }
    .p-4 {
      font-size: 26px;
      width: 640px;
      left: auto;
      right: 1px;
      top: auto;
      bottom: 25px;
    } */
  }


  @media (max-width: 1390px) {

    .p-4 {
      top: 835px;
      left: 715px;
    }
    
  }



  @media (max-width: 1300px) {
    #kak-prohodyat-uroki > p {
      height: 120px;
    }


    section.main > aside > .person {
      width: 455px;
      height: 532px;
      margin-top: 100px;
    }

    #prepodavatel-kursa > a:nth-child(1), #prepodavatel-kursa > a:nth-child(2) {
      top: 430px;

      width: 250px;
      background-size: contain;
      background-repeat: no-repeat;
    }









    .p-1 {
      font-size: 32px;
    }
    .p-2 {
      font-size: 29px;
      width: 500px;

      top: auto;
      bottom: 264px;
    }
    .p-3 {
      font-size: 29px;
      top: auto;
      bottom: 80px;
    }
    .p-4 {
      font-size: 24px;
      width: 610px;
      left: auto;
      right: 10px;
      top: auto;
      bottom: 5px;
    }








  }






  @media (max-width: 1240px) {
    #komu-podoydet > h2 {
      width: 204px;
      height: 38px;
      margin: 60px auto 0px auto;
    }

    #komu-podoydet > p {
      width: 100%;
      font-family: Montserrat;
    font-weight: 400;
    font-style: Regular;
    font-size: 18px;
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;

    margin-top: 15px;
    }

    #komu-podoydet > aside {
      /* background-image: url('./section-11-mobile.png'); */
      width: 100%;
      max-width: 356px;
      height: auto;

      margin: 43px auto 0px auto;

      display: flex;
      align-items: center;
      justify-content: start;
      flex-wrap: nowrap;
      flex-direction: column;
      gap: 20px;
    }




    .grid div {
      width: 100%;
      max-width: 388px;
      height: 166px;
      border-radius: 30px;
      background-image: url('./asdsadq1.svg');
    }

    .grid div p {
      font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 20px;
leading-trim: NONE;
line-height: 130%;
letter-spacing: 0%;
text-align: center;

    }


    .grid .b1 p {
      width: 323px;
    }
    .grid .b2 p {
      width: 279px;
    }
    .grid .b3 p {
      width: 351px;
    }
    .grid .b4 p {
      width: 358px;
    }
    .grid .b5 p {
      width: 367px;
    }
    .grid .b6 p {
      width: 239px;
    }

    #komu-podoydet > aside > div:nth-child(1) > img {
      width: 80px;
      height: 78px;
    }

    #komu-podoydet > aside > div > img {
      width: 80px;
    }

    #komu-podoydet > aside > div:nth-child(8) {
      width: 343px;
    }
    
    #esli-vam-eto-meshaet {
      background-image: url('./section-2-mobile.svg');
      height: 1015px;

      background-size: cover;
      width: 100%;
      max-width: 418px;
      border-radius: 25px;
      background-position: center;


    }

    #esli-vam-eto-meshaet > h2 {
      width: 227px;
      height: 38px;
      margin: 13px auto 0px auto;
    }

    #esli-vam-eto-meshaet > img {
      top: 110px;
      left: 50%;
      transform: translateX(-50%);
      width: 95vw;
      max-width: 384px;
    }
    

    #esli-vam-eto-meshaet > ul > li {
      font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 18px;
leading-trim: NONE;
line-height: 120%;
letter-spacing: 0%;

    }

    #esli-vam-eto-meshaet > ul {
      margin: 485px 25px 100px 50px;
      gap: 10px;
      width: auto;
      padding-bottom: 20px;
    }

    #esli-vam-eto-meshaet > ul > li:nth-child(1) {
      width: 95%;
      max-width: 217px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(2) {
      width: 95%;
      max-width: 260px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(3) {
      width: 95%;
      max-width: 320px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(4) {
      width: 95%;
      max-width: 364px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(5) {
      width: 95%;
      max-width: 245px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(6) {
      width: 95%;
      max-width: 344px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(7) {
      width: 95%;
      max-width: 382px;
    }
    #esli-vam-eto-meshaet > ul > li:nth-child(8) {
      width: 95%;
      max-width: 365px;
    }

    









    .p-1 {
      font-size: 32px;
    }
    .p-2 {
      font-size: 29px;
      width: 500px;

      top: auto;
      bottom: 264px;
    }
    .p-3 {
      font-size: 29px;
      top: auto;
      bottom: 80px;
    }
    .p-4 {
      font-size: 24px;
      width: 610px;
      left: auto;
      right: 10px;
      top: auto;
      bottom: 5px;
    }








    #rezultati-uroka > h2 {
      width: 242px;
      height: 38px;
      margin: 0px auto;
    }

    #rezultati-uroka {
      margin-top: 82px;
      padding: 0;
    }


    .grid {
      grid-template-columns: repeat(1, 100%);
      width: 100%;
      max-width: 388px;
      margin-top: 30px;
    }

    .grid img {
      width: 388px;
      height: 166px;
    }

    #rezultati-uroka {
      min-height: 0px;
    }
    #rezultati-uroka h3 {
      width: 262px;
      height: 30px;
    }


    #rezultati-uroka > aside {
      background-image: url('./section-3-mobile.svg');

      width: 100%;
      max-width: 414px;
      /* margin-left: -15px; */
      height: 415px;
    }

    #rezultati-uroka > aside > a {
      width: 90%;
      max-width: 384px;
      height: 52px;
      margin-top: 25px;

    }

    #rezultati-uroka > aside > span {
      flex-direction: column;

      width: 200px;
      height: 187px;
      gap: 55px;
      margin-top: 64px;
    }

    #rezultati-uroka > aside > span > a > img {
      width: 199px;
      height: 66px;
    }
    .grid img {
      width: 100%;
      max-width: 388px;
      border-radius: 30px;
    }
    #rezultati-uroka > aside > a > p {
      font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 18px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
margin-right: 25px;
    }

    #rezultati-uroka > aside > a > img {
      width: 22px;
      height: 45px;
      right: 19px;
      top: 7px;
    }

    #prepodavatel-kursa {
      margin-top: 60px;
      background-image: url('./section-4-mobile.webp');
      max-width: 414px;
      min-height: 884px;
      background-position: center;
      background-size: cover;
    }

    .p-1 {
      left: 50%;
      transform: translateX(-50%);
      text-align: center;
      font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 21px;
leading-trim: NONE;
line-height: 130%;
letter-spacing: 0%;
text-align: center;
padding-left: 0px;


width: 100%;
height: 211px;
max-width: 380px;
top: 90px;
    }


    .p-2 {
      font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 16px;
leading-trim: NONE;
line-height: 130%;
letter-spacing: 0%;

top: 400px;
left: 30px;
width: 273px;
height: 80px;
}

.p-3 {
  top: 558px;
  left: 30px;
  width: 207px;

  font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 16px;
leading-trim: NONE;
line-height: 130%;
letter-spacing: 0%;

}

.p-4 {
  width: 362px; 
  height: 103px;
  top: 672px;

  font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 16px;
leading-trim: NONE;
line-height: 130%;
letter-spacing: 0%;

left: 30px;
right: auto;
 
}

    #prepodavatel-kursa > a:nth-child(1), #prepodavatel-kursa > a:nth-child(2) {
      background-image: url('./');
      top: 320px;
      width: 182px;
      height: 34px;
    }

    #prepodavatel-kursa > a:nth-child(1) {
      left: 15px;
    }

    #prepodavatel-kursa > a:nth-child(2) {
      right: 15px;
      left: auto;
    }

    .bonus * {
      display: none;

    }
    .bonus {
      width: 384px;
      height: 62px;
      /* margin-top: -90px !important; */
      position: absolute;
      bottom: 1360px;
      left: 50%;
      transform: translateX(-50%);
      margin: 0;
      background-color: transparent;
    }

    #kak-prohodyat-uroki {
      margin-top: 60px;
      min-height: 561px;
      height: auto;
      padding: 0;
    }

    #kak-prohodyat-uroki h2 {
      width: 263px;
      height: 38px;
      margin: 0px auto;
      line-height: 38px;
    }

    #kak-prohodyat-uroki > p, 
    #kak-prohodyat-uroki > p > a {
      width: 100%;
      font-family: Montserrat;
font-weight: 400;
font-style: Regular;
font-size: 22px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
text-align: center;

    }

    #kak-prohodyat-uroki > div {
      margin-top: 25px;
      width: 100%;
      flex-wrap: nowrap;
      flex-direction: column;
      gap: 10px;
      height: auto;
      /* max-height: 456px; */
    }
    #kak-prohodyat-uroki > div > img {
      width: 384px;
      height: 223px;

    }

    #kak-prohodyat-uroki > a {
      width: 384px;
      height: 50px;
      margin-top: 20px;
      border-radius: 15px;
    }
    #kak-prohodyat-uroki > a > p {
      font-family: Montserrat;
font-weight: 500;
font-style: Medium;
font-size: 16px;
leading-trim: NONE;
line-height: 50px;
letter-spacing: 0%;
margin-right: 20px;

    }

    #kak-prohodyat-uroki > a > img {
      width: 20px;height: 40px;
      right: 14px;

    }#kak-prohodyat-uroki > span > p {
      margin-bottom: 5px;
    }

    #kak-prohodyat-uroki > span > img {
      width: 30px;
      height: 35px;
    }



    footer {
margin-top: 60px;
height: auto;
padding-bottom: 35px;
    }

    footer > div {
      flex-wrap: nowrap;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding-top: 25px;
      gap: 25px;
    }
    footer > div > p {
      text-align: center;
      
    }







    video, .video, .blur {
      display: none;
    }






    footer > div > div {
      flex-direction: column;
      gap: 15px;
    }

    footer > div > span {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

    footer > div > a {
      margin-top: 0;
    }

    #kak-prohodyat-uroki > div > img {
      margin: 0px auto;
      
    }


    #kak-prohodyat-uroki > p {
    width: 90%;
     
    margin: 20px auto 0px auto;

    height:  120px;
    }
  }


  @media (max-width: 380px) {
    #kak-prohodyat-uroki > div > img {

      width: 330px;
      border-radius: 40px;
      height: 223px;



    }

    #kak-prohodyat-uroki > a {
      width: 330px;
    }

    #kak-prohodyat-uroki > a > p {
      white-space: nowrap;
      font-size: 14px;
    }
    #kak-prohodyat-uroki > span > p, section.main > aside > div > a > p {
      font-size: 16px;
    }

    #kak-prohodyat-uroki > a > img, section.main > aside > div > a > img {
      right: 6px;
    }
    .grid {
      padding: 0px 5px;
    }






  }









  .video {
    position: absolute;
    display: flex;
    /* width: 600px; */
    width: 43%;
    height: auto;
    right: 40px;
    top: 70px;
    border-radius: 30px;
  }

  video {
    width: 100%;
    border-radius: 30px;
    height: auto;
  }

  .blur {
    position: absolute;
    display: flex;
    /* width: 600px; */
    width: 100%;
    height: 100%;
    border-radius: 30px;
    background-image: url('./blur.svg');
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 10;
    transition: all 1s;
  }


  




  @media (max-width: 1440px) {
    #kak-prohodyat-uroki .slider-row img.desktop {
      width: 43vw;
    }


  }













  .left-mobile-1,
  .left-mobile-2,
  .right-mobile-1,
  .right-mobile-2 {
    display: none;
    position: absolute;
    z-index: 10;  pointer-events: none;

    width: 69px !important;
    height: 36px !important;
  }

  .left-desktop-1,
  .left-desktop-2,
  .right-desktop-1,
  .right-desktop-2 {
    display: flex;    position: absolute;
    z-index: 10;  pointer-events: none;
  }



  #kak-prohodyat-uroki .sliders-desktop, #kak-prohodyat-uroki .mobile-sliders {
    position: relative;
  }

  .left-desktop-1 {
    left: -45px;
    top: 25%;
    transform: translateY(-50%);  pointer-events: none;
  }

  .left-desktop-2 {
    left: -45px;
    top: 75%;
    transform: translateY(-50%);  pointer-events: none;
  }


  .right-desktop-1 {
    right: -45px;
    top: 25%;
    transform: translateY(-50%);  pointer-events: none;
  }

  .right-desktop-2 {
    right: -45px;
    top: 75%;
    transform: translateY(-50%);
    pointer-events: none;
  }





  .left-mobile-1 {
    left: -32px ;
    top: 25%;
    transform: translateY(-50%);  pointer-events: none;
  }

  .left-mobile-2 {
    left: -32px;
    top: 75%;
    transform: translateY(-50%);  pointer-events: none;
  }


  .right-mobile-1 {
    right: -32px;
    top: 25%;
    transform: translateY(-50%);  pointer-events: none;
  }

  .right-mobile-2 {
    right: -32px;
    top: 75%;
    transform: translateY(-50%);
    pointer-events: none;
  }

  @media (max-width: 1440px) {
    .right-desktop-1 {
      right: 1.5vw;
    }
  
    .right-desktop-2 {
      right: 1.5vw;

    }
  } 
  


  @media (max-width: 1240px) {

    .left-desktop-1,
    .left-desktop-2,
    .right-desktop-1,
    .right-desktop-2 {
      display: none;    position: absolute;
      z-index: 10;
      pointer-events: none;
    }


    .left-mobile-1,
    .left-mobile-2,
    .right-mobile-1,
    .right-mobile-2 {
      display: flex;    position: absolute;
      z-index: 10;
      width: 69px !important;
      height: 36px !important;
      pointer-events: none;
    }


    
    footer > div > p {
      width: 150px;
    } 
  }





  




  @media (max-width: 400px) {
    #prepodavatel-kursa {
      background-image: url('./789.webp');
    }

    .p-4{
      font-size: 14px;
      width: 330px;
      left: 8vw;
      top: 668px;
    }

    .p-3, .p-2 {
      font-size: 14px;

    }

    .p-2 {
      top: 415px;
    }




  }