.adaptive-width
  {
    width: 100%
  }
  .how-to-mini-text {
    line-height: 20px;
  }
  .how-to-mini-text-3 {
    line-height: 24px;
  }
  .button-mobile {
    letter-spacing: 0;
  }
  .text-title-p {
    font-size: 23px;
    letter-spacing: 0;
  }
  .border {
    border: 1px solid #333333;
  }
  .or-how-to-mobile {
    line-height: 24px;
    margin: 5px 0px 10px;
  }
  /* .button-header {
    align-items: center;
  }
  .button-header p {
    font-size: 20px;
    letter-spacing: 0;
    line-height: 100%;
  } */
  .accordion__active .arrow-down-image {
    transform: rotate(180deg);
  }

  /* Extra small devices (phones, 600px and down) */
  @media only screen and (max-width: 600px)
  {
    .adaptive-width 
    {
      width: 100%
    }
    .header-block {
      display: none;
    }
    .mega-marathon {
      display: none;
    }
    .mega-prizes {
      display: none;
    }
    .sertifcates {
      display: none;
    }
    .how-to {
      display: none;
    }
    .footer {
      display: none;
    }
    
  }

  /* Small devices (portrait tablets and large phones, 600px and up) */
  @media only screen and (min-width: 600px) 
  {
    .adaptive-width 
    {
      width: 100%
    }
    .header-block {
      display: none;
    }
    .mega-marathon {
      display: none;
    }
    .mega-prizes {
      display: none;
    }
    .sertifcates {
      display: none;
    }
    .how-to {
      display: none;
    }
    .footer {
      display: none;
    }
    .megaprizes-image, .superprizes-image {
      height: 500px;
    }
  }

  /* Medium devices (landscape tablets, 768px and up) */
  @media only screen and (min-width: 768px) 
  {
    .adaptive-width 
    {
      width: 100%;
    }
    .megaprizes-image, .superprizes-image {
      height: 600px;
    }
    .header-block {
      display: none;
    }
    .mega-marathon {
      display: none;
    }
    .mega-prizes {
      display: none;
    }
    .sertifcates {
      display: none;
    }
    .how-to {
      display: none;
    }
    .footer {
      display: none;
    }
  }

  /* Large devices (laptops/desktops, 992px and up) */
  @media only screen and (min-width: 992px) 
  {
    .adaptive-width 
    {
      width: 100%;
    }
  }

  /* Extra large devices (large laptops and desktops, 1200px and up) */
  @media only screen and (min-width: 1200px) 
  {
    .bg-gray-100 {
      background-color: #ffffff;
    }
    .adaptive-width 
    {
      max-width: 1920px;
    }
    .display-none-pc {
      display: none;
    }
    .accordion {
      display: none;
    }
    .marathon-mobile {
      display: none;
    }
    .mega-prizes-mobile {
      display: none;
    }
    .sertifcates-mobile {
      display: none;
    }
    .how-to-mobile {
      display: none;
    }
    .lines-mobile {
      display: none;
    }
    .footer-mobile {
      display: none;
    }
    .header-block
    {
      padding: 0 240px;
      height: 57px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      filter: drop-shadow(0px 2px 4px rgba(0,0,0,0.2));
    }
    .logotype-menu {
      display: flex;
    }
    .logotype-block {
      height: 100%;
      display: flex;
      align-items: center;
    }
    .logotype {
      width: 148px;
      height: 26.29px;
      margin-right: 38px;
    }
    .menu-header {
      display: flex;
    }
    .menu-item {
      font-size: 14px;
      font-weight: 700;
      padding: 0 12px;
      line-height: 24px;
    }
    .button-header {
      padding: 0 40px;
      display: flex;
      justify-content: center;
    }
    .button-header p {
      line-height: 28px;
      font-weight: 700;
      font-size: 14px;
    }
    .mega-marathon {
      height: 727px;
      background-color: #00B956;
      padding: 93px 240px;
      display: flex;
      background-image: url('src/img/marathon-image.png');
      background-repeat: no-repeat;
      background-position: bottom right;
    }
    .title-text-button-marathon {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
    .title-marathon {
      font-size: 90px;
      font-weight: 700;
      letter-spacing: -4px;
    }
    .text-marathon {
      font-size: 38px;
      font-weight: 400;
      letter-spacing: 0px;
      margin-top: -70px;
    }
    .button-marathon {
      display: flex;
      align-items: center;
      width: 383px;
      height: 71px;
      border-radius: 54px;
    }
    .button-marathon p {
      font-size: 24px;
      letter-spacing: 0px;
      font-weight: 700;
    }
    .title-prizes h2 {
      font-weight: 700;
      letter-spacing: -4px;
      font-size: 90px;
    }
    .text-prizes p {
      font-size: 52px;
      letter-spacing: 0px;
      font-weight: 700;
    }
    .mega-prizes {
      display: flex;
    }
    .image-list-prizes {
      padding: 10px 240px 90px 0px;
      display: flex;
      align-items: center;
    }
    .img-prizes {
      max-width: 997px;
      max-height: 851px;
    }
    .list-prizes {
      width: 576px;
    }
    .list-prizes-padding {
      padding: 51px 47px 26px 47px;
    }
    .list-title-prizes {
      font-size: 38px;
      font-weight: 400;
      padding-bottom: 20px; 
    }
    .list-item-prizes {
      padding-bottom: 15px;
    }
    .circle-list-prizes {
      width: 87px;
      height: 38px;
      border-radius: 42px;
      font-size: 29px;
      font-weight: 400;
    }
    .text-list-prizes {
      font-size: 27px;
      font-weight: 400;
    }
    .text-all-prizes {
      font-size: 30px;
      font-weight: 700;
      letter-spacing: 2px;
    }
    .sertifcates {
      display: flex;
    }
    .how-to {
      border-radius: 42px;
      padding: 30px 240px;
      margin-bottom: 70px;
      background: url('src/img/how-to.webp'), linear-gradient(45deg, rgba(0, 185, 86, 1) 0%, rgba(0, 185, 86, 1) 30%, rgba(30, 250, 100, 1) 100%);
      /* background-image: url('src/img/how-to.webp'); */
      background-size: contain;
      background-repeat: no-repeat;
      background-position: left;
      display: flex;
      flex-direction: row;
      justify-content: space-around;
    }
    .how-to-title {
      font-size: 90px;
      font-weight: 700;
      letter-spacing: -4px;
      line-height: 100%;
      width: 673px;
    }
    .how-to-steps {
      display: flex;
      flex-direction: column;
      width: 860px;
    }
    .button-how-to {
      letter-spacing: 0px;
    }
    .how-to-text-tarif {
      line-height: 18px;
    }
    .round-number {
      border-top-left-radius: 50px;
      border-top-right-radius: 50px;
      border-bottom-left-radius: 50px;
      border-bottom-right-radius: 50px;
    }
    .block-how-to {
      border-radius: 0px 21px 21px 21px;
      padding: 30px;
    }
    .or-how-to {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .how-to-or {
      width: 305px;
    }
    .how-to-title-mini {
      font-size: 33px;
    }
    .or {
      width: 85px;
    }
    .footer {
      border-radius: 21px 21px 0px 0px;
      height: 200px;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
    }
    .links-footer {
      padding-right: 50px;
      font-size: 15px;
    }
    .copyright {
      font-size: 12px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1750px)
  {
    .title-text-button-marathon {
      padding: 10px;
    }
    .mega-marathon {
      background-position: center right;
      background-size: 75%;
    }
    .image-list-prizes {
        padding: 10px 20px 90px 0px;
        display: flex;
    }
    
  }
  @media only screen and (min-width: 1500px) and (max-width: 1750px)
  {
    .img-prizes {
        max-width: 700px;
        max-height: 600px;
    }
    .sertifcates {
      padding: 0 240px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1500px)
  {
    .header-block {
        padding: 0 150px;
    }
    .mega-marathon {
      padding: 100px 150px;
      background-position: center right;
      background-size: 75%;
    }
    .title-text-button-marathon {
      padding: 10px;
      width: 70%;
    }
    .how-to {
      flex-direction: column;
      align-items: center;
    }
    .how-to-title {
      justify-content: center;
    }
    .how-to-title p {
      width: 100%;
      text-align: center;
    }
    .button-header p {
      font-size: 12px;
    }
    .button-header {
        padding: 0 10px;
    }
    .image-list-prizes {
        /* padding: 10px 400px 90px 400px; */
        display: flex;
        /* flex-direction: column; */
        align-items: center;
    }
    .img-prizes {
        max-width: 600px;
        max-height: 400px;
    }
    .sertifcates {
      padding: 0 150px;
    }
    .how-to-title h2 {
      text-align: center;
    }
  }

  @font-face 
  {
    font-family: 'GT Walsheim Pro';
    src: url('src/fonts/GT-Walsheim-Pro-Regular.otf');
  }

  @font-face 
  {
    font-family: 'GT Walsheim Pro Bold';
    src: url('src/fonts/GT-Walsheim-Pro-Bold.otf');
  }

   @font-face 
  {
    font-family: 'GT Walsheim Pro Black';
    src: url('src/fonts/GT-Walsheim-Pro-Black.otf');
  }


  .img 
  {
    overflow-clip-margin: content-box;
    overflow: clip;
  }

  .accordion 
  {
	  overflow: hidden;
  }

  .accordion__intro
  {
    position: relative;
    cursor: pointer;
  }
  .accordion__content
  {
    max-height: 0;
    overflow: hidden;
    will-change: max-height;
    transition: all 0.25s ease-out;
    opacity: 1;
  }
  .accordion__active
  {
    opacity: 1;
  }


  .menu-icon-image
  {
    background-image:url('src/img/menu_icon.webp');
  }
  .chest-image
  {
    background-image:url('src/img/chest.webp')
  }
  .megaprizes-image
  {
    background-image:url('src/img/megaprizes.webp')
  }
  .megaprizes2-image
  {
    background-image:url('src/img/megaprizes2.webp')
  }
  .superprizes-image
  {
    background-image:url('src/img/new/serts.webp');
  }
  .superprizes-image-pc
  {
    background-image:url('src/img/certs.webp');
  }
  .megaprize-image
  {
    background-image:url('src/img/megaprize.webp')
  }
  .footer-image
  {
    background-image:url('src/img/footer.webp');
  }
  .megafon-logo-image
  {
    background-image:url('src/img/megafon_logo.webp')
  }
  .megafon-logo-image-external
  {
    background-image:url('https://www.megafon.ru/download/~federal/~federal/icons/mf-top-logo.svg?year=2025');
  }
  .arrow-down-image
  {
    background-image:url('src/img/arrow_down.png');
  }
  .arrow-right-image
  {
    background-image:url('src/img/Arrow_right.svg');
  }

  .btn-purple 
  {
    cursor: pointer;
    background: #731982;
    background: linear-gradient(90deg, rgba(115, 25, 130, 1) 0%, rgba(115, 25, 130, 1) 40%, rgba(230, 77, 230, 1) 100%);
  }
  .btn-purple:hover 
  {
    background: rgb(93, 21, 105);
  }

  .btn-gray
  {
    cursor: pointer;
  }
  .btn-gray:hover
  {
    background-color: #d0d0d0;
  }

  .btn-green
  {
    cursor: pointer;
  }
  .btn-green:hover
  {
    background: rgb(0, 95, 44);
  }

  .GT-Walsheim-Pro
  {
    font-family: 'GT Walsheim Pro'; 
  }
  .GT-Walsheim-Pro-Bold
  {
    font-family: 'GT Walsheim Pro Bold';
  }
  .GT-Walsheim-Pro-Black
  {
    font-family: 'GT Walsheim Pro Black';
  }

  .text-gradient
  {
    background-image: linear-gradient(90deg, rgba(115, 25, 130, 1) 0%, rgba(115, 25, 130, 1) 30%, rgba(230, 77, 230, 1) 100%);
    color: transparent;
    background-clip: text;
  }

  .super-prizes-gradient
  {
    background: linear-gradient(45deg, rgba(0, 185, 86, 1) 0%, rgba(0, 185, 86, 1) 30%, rgba(30, 250, 100, 1) 100%);
  }

/* фикс у низа с учётом переменной отступа */
.cta-fixed {
  position: fixed;
  left: 50%;
  bottom: var(--cta-bottom, 0);
  transform: translate(-50%, 0);
  z-index: 100;
}

/* переход именно по transform (и bottom на всякий случай) */
.cta-anim {
  will-change: transform, bottom;
  transition: transform 220ms ease, bottom 220ms ease;
}

/* спейсер чтобы контейнер не прыгал */
.cta-spacer { height: 0; pointer-events: none; }
#ctaButton { transition: opacity 120ms linear; }
#ctaButton-pc { transition: opacity 120ms linear; }