@import url('https://fonts.googleapis.com/css2?family=Asap+Condensed:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Bebas+Neue&family=League+Gothic&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

.header {
    background-image: url(../assets-2/headerFon.png);
    background-repeat: no-repeat;
    background-size: 100%;
    min-height: 660px;

    position: relative;
}

.header__top {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 20px;
    gap: 10px;
    padding-bottom: 30px;
}

.header__top-left {
    font-weight: 600;
    font-size: 12px;
    line-height: 133%;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    border: 1px solid #f5b085;
    border-radius: 56px;
    width: 163px;
    height: 39px;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    box-shadow: 0 5px 31px 0 rgba(0, 0, 0, 0.24);
    background: linear-gradient(164deg, #ff4aab 0%, #f291c5 100%);
}

.header__top-right {
    font-weight: 500;
    font-size: 12px;
    line-height: 133%;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #000;
    border-radius: 20px;
    width: 143px;
    height: 39px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.title {
    font-weight: 300;
    font-size: 74px;
    line-height: 75%;
    text-align: center;
    font-family: 'League Gothic';
    text-transform: uppercase;
    color: transparent;
    background: linear-gradient(#ffffff, #ffffff, #ffffff, #a9a9a9);
    -webkit-background-clip: text;
    background-clip: text;
}

.subtitle {
    font-weight: 300;
    font-family: 'League Gothic';
    border: 1px solid #777777;
    align-items: center;
    display: flex;
    justify-content: center;
    font-size: 25px;
    line-height: 84%;
    letter-spacing: 0.1em;
    text-align: center;
    margin: 0 auto;
    color: #fff;
    border-radius: 56px;
    width: 318px;
    height: 33px;
    box-shadow: 0 5px 38px 0 #000;
    background: rgba(0, 0, 0, 0);
}

.heeader-infoText {
    font-weight: 600;
    font-size: 16px;
    line-height: 131%;
    text-transform: uppercase;
    color: #fff;
    padding-left: 30px;
    padding-top: 30px;
}

.heeader-unferText {
    font-weight: 600;
    font-size: 16px;
    line-height: 131%;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
}

.priceBlock {
    position: absolute;
    bottom: 27.5%;
    left: 35%;
    display: flex;
    flex-direction: column;
    gap: 35px;
    justify-content: center;
    align-items: center;
    transform: translate(-50%, -50%);
}



.price-top {
    font-weight: 500;
    font-size: 12px;
    line-height: 15px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px
}

.price-bottom {
    font-weight: 500;
    font-size: 12px;
    line-height: 125%;
    color: rgba(255, 255, 255, 0.88);
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.price-top span {
    font-weight: 300;
    font-size: 50px;
    line-height: 40%;
    text-align: center;
    color: #fff;
    font-family: 'League Gothic';
}

.price-bottom span {
    font-weight: 300;
    font-size: 24px;
    line-height: 83%;
    text-decoration: line-through;
    text-align: center;
    color: rgba(255, 255, 255, 0.88);
    font-family: 'League Gothic';
}

.sign-up {
    padding: 10px;
    position: absolute;
    bottom: -20px;
    width: 100%;
}

.sign-up-button {
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    padding-top: 24px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    background-image: url(../assets-2/signup.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    max-width: 349px;
    width: 100%;
    height: 140px;
    transform: translateX(5px);
    margin: 0 auto 30px auto;
    display: block;
    justify-content: center;
    align-items: flex-end;
    position: relative;
    z-index: 4;
    padding-bottom: 33px;
    padding-right: 20px;
}

.sign-up-text {
    font-weight: 400;
    font-size: 16px;
    line-height: 131%;
    padding-top: 10px;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
}

.bonus-wrapper {
    padding: 0 10px;
}

.bonus {
    background-image: url(../assets-2/bonus.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    min-height: 220px;
    padding: 30px;
    border-radius: 23px;
    margin-top: 80px;

    box-shadow: 0px -40px 60px -30px #FF4BAB;
}

.bonus-gift {
    width: 72px;
    height: 72px;
    margin: -75px auto 0 auto;
}

.bonus-title {
    font-weight: 300;
    font-size: 36px;
    line-height: 106%;
    width: 67%;
    font-family: 'League Gothic';
    text-transform: uppercase;
    color: #fff;
}

.bonus-subTitle {
    font-weight: 700;
    font-size: 14px;
    line-height: 179%;
    text-transform: uppercase;
    color: #fff;
}

.bonus-text {
    font-weight: 500;
    font-size: 14px;
    line-height: 129%;
    color: #fff;
    text-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.24);
}



.upgraded {
    padding: 50px 0px;
    position: relative;
}

.upgraded::before,
.upgraded::after {
    content: "";
    display: block;
    position: absolute;
    top: 180px;
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

.upgraded::before {
    box-shadow: 0 0 200px 200px #7373737d;
    left: -33%;
}

.upgraded::after {
    box-shadow: 0 0 200px 200px #ff4bab99;
    right: -53%;
}

.mainTitle {
    font-weight: 300;
    font-size: 64px;
    line-height: 97%;
    font-family: 'League Gothic';
    text-transform: uppercase;
    color: #fff;
}

.upgraded-img {
    width: 100%;
}


.guar {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    max-width: 428px;
    width: 100%;
    padding: 25px;
    background: linear-gradient(157deg, rgba(0, 0, 0, 0.2) 0%, rgba(139, 138, 138, 0.2) 100%);
}

.guar-content {
    border-radius: 24px;
    padding: 22px 27px 5px 27px;
    width: 100%;
    background: linear-gradient(147deg, #ff4bab 0%, #000 94.55%);
}

.guar-title {
    font-weight: 200;
    font-size: 44px;
    line-height: 100%;
    text-transform: uppercase;
    color: #fff;
    font-family: 'League Gothic';
}

.guar-content-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.guar-subTitle {
    font-weight: 700;
    font-size: 20px;
    line-height: 120%;
    padding-bottom: 10px;
    color: #fff;
}

.guar-text {
    font-weight: 500;
    font-size: 14px;
    line-height: 129%;
    color: #fff;
}

.check {
    height: 133px;
    width: 90px;
    object-fit: cover;
}



.inside {
    padding: 50px 10px;
    position: relative;
}


.inside::before,
.inside::after {
    content: "";
    display: block;
    position: absolute;
    top: 180px;
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

.inside::before {
    box-shadow: 0 0 200px 200px #ff4bab99;
    left: -53%;
}

.inside::after {
    box-shadow: 0 0 200px 200px #ff4bab99;
    right: -53%;
}


.inside-content {
    padding-top: 30px;
}

.inside-content-items {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 10px;
}

.inside-content-items-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.inside-number {
    font-weight: 300;
    font-size: 86px;
    font-family: 'League Gothic';
    line-height: 90px;
    margin-bottom: -25px;
    text-align: center;
    background: linear-gradient(180deg, #f190c4 0%, #ff5fb5 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.inside-text {
    font-weight: 500;
    width: 127px;
    font-size: 16px;
    line-height: 133%;
    padding: 3px 0;
    text-align: center;
    color: #fff;
    backdrop-filter: blur(2px);
    box-shadow: 0 5px 38px 0 #000;
    background: linear-gradient(270deg, #0400018d, #040001a6, #8127559a);
    border: 1px solid #676666;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inside-content-itemBottom {
    display: flex;
    align-items: flex-end;
    justify-content: center;

    position: relative;
    max-width: 290px;
    margin: 0 auto;
    transform: translateX(-40px);
    z-index: 2;
}

.labek-1 {
    width: 87px;
    height: 50px;
    position: absolute;
    right: 0;
    top: 10px;
    z-index: -1;
}

.labek-2 {
    width: 87px;
    height: 50px;
    position: absolute;
    right: -20px;
    bottom: -15px;
    z-index: 3;
}

.heards {
    width: 65px;
}

.inside-content-itemBottom .inside-text {
    text-align: left;
    justify-content: left;
    padding-left: 10px;
    width: 154px;
}

.inside-content-itemBottom-2 {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: -20px;
    margin-top: 20px;
}

.inside-content-itemBottom-2 .inside-text {
    width: 216px;
    margin-left: -30px;
}

.days {
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.day {
    background: radial-gradient(57.46% 57.46% at 50% 50%, #992d67 0%, #030202 100%);
    border-radius: 20px;
    border: 1px solid #676666;
    max-width: 178px;
    width: 100%;
    margin-bottom: 20px;
}

.day-title {
    font-weight: 700;
    font-size: 18px;
    line-height: 121%;
    text-align: center;
    color: #fff;
    padding-top: 10px;
}

.day-text {
    font-weight: 400;
    font-size: 14px;
    list-style: initial;
    padding: 10px 25px;
    line-height: 121%;
    color: #fff;
}


.video-wrapper {
    position: relative;
    cursor: pointer;
    /* щоб зрозуміти, що можна натискати */
    border: 2px solid #E387B8;
    border-radius: 20px;
}

.day-video {
    width: 100%;
    display: block;
    border-radius: 20px;
}

.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 1px solid #fff;
    cursor: pointer;
    background: linear-gradient(203deg, #f190c4 0%, #ff4bab 100%);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.play-btn-img {
    width: 12px;
    height: 12px;
}



.videoBlock-video-wrapper {
    position: relative;
    cursor: pointer;
    /* щоб зрозуміти, що можна натискати */
    border: 2px solid #E387B8;
    border-radius: 20px;
    margin-top: 10px;
}

.videoBlock-day-video {
    width: 100%;
    display: block;
    border-radius: 20px;
}

.videoBlock-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70px;
    height: 70px;
    border-radius: 100%;
    border: 1px solid #fff;
    cursor: pointer;
    background: linear-gradient(203deg, #f190c4 0%, #ff4bab 100%);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.videoBlock-play-btn-img {
    width: 22px;
    height: 22px;
}


.why{
    background-image: url(../assets-2/why.png);
    background-repeat: no-repeat;
    background-size: 100%;
    min-height: 740px;
    padding: 20px 10px;
    height: 100%;

    margin: 50px 0;
}



.why-items{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 10px;
}

.why-items-item{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.why-items-item p{
font-weight: 700;
font-size: 14px;
line-height: 121%;
text-align: center;
color: #fff;
}

.whyTitl3{
    font-weight: 700;
font-size: 24px;
line-height: 146%;
text-transform: uppercase;
text-align: center;
color: #fff;
}

.why-items-item:nth-child(1) img{
width: 73px;
height: 55px;
}
.why-items-item:nth-child(2) img{
    width: 84px;
height: 55px;
}
.why-items-item:nth-child(3) img{
width: 64px;
height: 55px;
}


.videoBlock{
    position: relative;
    padding: 0 10px;
}

.videoBlock::before,
.videoBlock::after {
    content: "";
    display: block;
    position: absolute;
    top: 180px;
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

.videoBlock::before {
    box-shadow: 0 0 150px 150px #ff4bab99;
    left: -43%;
}

.videoBlock::after {
    box-shadow: 0 0 150px 150px #ff4bab99;
    right: -43%;
}

.coach{
    padding: 70px 10px 10px 10px;
}

.coach-black{
    background-image: url(../assets-2/cb.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 25px 20px;
    margin-top: 10px;
}

.coach-black-text{
    font-weight: 500;
font-size: 14px;
line-height: 121%;
color: #fff;
text-shadow: 0 4px 36px 0 #000;
display: block;
width: 72%;
margin-left: auto;
}

.coach-black-text span{
    font-weight: 600;
font-size: 14px;
line-height: 121%;
text-transform: uppercase;
color: #ff89c8;
}


.programs{
    background: linear-gradient(342deg, #5c344a 0%, #000 48.96%, #ff4bab 100%);
    border-radius: 30px;
    padding: 40px 15px 20px 15px;
    margin: 50px 0;
}

.programs-title{
    font-weight: 300;
    font-size: 44px;
    line-height: 111%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    font-family: 'League Gothic';
    padding-bottom: 30px;
}

.programs-item{
    display: flex;
    flex-direction: column;
    gap: 5px;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
}

.programs-item-title{
    font-weight: 600;
    font-size: 16px;
    line-height: 131%;
    text-align: center;
    color: #fff;
    box-shadow: 0 5px 38px 0 #000;
    background: rgba(0, 0, 0, 0);
    border-radius: 56px;
    border: 1px solid #b9b9b9;
    max-width: 347px;
    width: 100%;
    min-height: 33px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.programs-item-content{
    border-radius: 41px;
    max-width: 370px;
    width: 100%;
    min-height: 82px;
    padding: 0 20px;
    background: linear-gradient(180deg, #949494 0%, #fff 34.62%, #fff 100%);

    display: flex;
    align-items: center;
    justify-content: center;
}

.programs-item-content img{
    width: 82px;
    height: 69px;
}

.programs-item-content-title{
font-weight: 700;
font-size: 14px;
line-height: 136%;
color: #000;
}

.programs-item-text{
    font-weight: 500;
font-size: 14px;
line-height: 136%;
color: #000;
}


.boxes{
    position: relative;
    padding: 0px 10px 100px 10px;
}

.boxes::before,
.boxes::after {
    content: "";
    display: block;
    position: absolute;
    top: 180px;
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

.boxes::before {
    box-shadow: 0 0 150px 150px #ff4bab99;
    left: -43%;
}

.boxes::after {
    box-shadow: 0 0 150px 150px #ff4bab99;
    right: -43%;
}

.boxes-title{
font-weight: 300;
font-size: 64px;
line-height: 108%;
text-transform: uppercase;
font-family: 'League Gothic';
text-align: center;
color: #fff;
}

.boxes-title span{
color: #f286c0;
}

.boxes-text{
    font-weight: 500;
font-size: 16px;
line-height: 150%;
text-align: center;
color: #fff;
padding: 20px 0;
}

.boxes-text span{
    font-weight: 700;
}

.boxes-img{
    position: relative;
    z-index: 9;
    border-radius: 30px;
}



.sliderWrapper{
    position: relative;
}

.sliderWrapper::before,
.sliderWrapper::after {
    content: "";
    display: block;
    position: absolute;
    top: 180px;
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

.sliderWrapper::before {
    box-shadow: 0 0 150px 150px #ff4bab99;
    left: -43%;
}

.sliderWrapper::after {
    box-shadow: 0 0 150px 150px #ff4bab99;
    right: -43%;
}




.asks {
    padding-bottom: 30px;
}

.asksContainer {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    max-width: 340px;
    width: 100%;
    margin: 40px auto;
    border-top: 1px solid #7b7b7b;
}

.asksContainer-item {
    border-bottom: 1px solid #7b7b7b;
    width: 100%;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.asksContainer-item-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}

.asksContainer-item-bottom {

    max-height: 0;
    overflow: hidden;
    padding-bottom: 15px;
    opacity: 0;
    transition: all 0.4s;
}

.asksContainer-item.active .asksContainer-item-bottom {
    opacity: 1;
}


.label {
    font-weight: 400;
    font-size: 35px;
    width: 30px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    transition: transform 0.3s ease;
}

.asksContainer-item p {
    max-width: 250px;
}

.contact {
    background-image: url(../assets-2/contact-fon.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 50px 0;
}

.contact-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding-top: 10px;
    padding-bottom: 50px;
    margin: 0 auto;
}

.contact-box-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.contactlink {
    font-weight: 400;
    font-size: 14px;
    line-height: 179%;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-align: center;
    display: block;
    margin: 0 auto;
    color: #cacaca;
}

.footer {
    background-image: url(../assets-2/footer.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 12px 0;
    position: fixed;
    z-index: 99;
    bottom: 0;
    opacity: 0;
    transform: translateY(150px);
    margin: 0 auto;
    width: 100%;
    max-width: 430px;

    transition: all .5s ease;
}

.footer.active {
    transform: translateY(0px);
    opacity: 1;
}

.footer-timer {
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
}

.footer-timer-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.footer-timer-value {
    border-radius: 150px;
    width: 67px;
    height: 38px;
    background-color: #fff;
    color: #000;
    font-family: "League Gothic", sans-serif;
    font-weight: 400;
    font-size: 30px;
    line-height: 117%;
    text-align: center;
}

.footer-timer-time {
    font-weight: 500;
    font-size: 10px;
    line-height: 100%;
    text-align: center;
    color: #fff;
}


.footer_text {
    padding-top: 1.6rem;
}


.atc {
    padding-top: 8rem;
    height: 46rem;
    background-image: url(../assets-2/atc_bg.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;

}

.table_2 {
    width: 100%;
    /* Таблица занимает всю доступную ширину */
    max-width: 1200px;
    /* Ограничение максимальной ширины */
    margin: 0 auto;
    /* Центрирование таблицы на странице */
    border-collapse: collapse;
    /* Убирает двойные границы */
    text-align: center;
    /* Выравнивание текста по центру */
}

.table_2 td {
    vertical-align: top;
    /* Выравнивание содержимого по верхнему краю */
    width: 50%;
    /* Каждая ячейка занимает половину ширины таблицы */
    box-sizing: border-box;
    /* Учитывает padding в ширине */
}

.table_item2 {
    display: flex;
    /* Используем flex для выравнивания содержимого */
    flex-direction: column;
    /* Элементы внутри ячейки располагаются вертикально */
    align-items: center;
    /* Выравнивание по центру по горизонтали */
    text-align: center;
    /* Текст выравнивается по центру */
    margin-top: 2rem;
}

.table_item2 img {
    max-width: 100%;
    max-height: 124px;

}

.table_item2 video {
    max-width: 100%;
    max-height: 124px;

}

.blue_p {
    text-transform: uppercase;
    text-align: center;
    color: #0EC4A2;
    font-weight: bold;
    margin: 10px 0;
}

.contacts {
    background-image: url(../assets-2/contacts.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 30px;
    margin-bottom: 230px;
}

.contacts-title{
    font-weight: 300;
font-size: 64px;
line-height: 80%;
text-transform: uppercase;
text-align: center;
font-family: "League Gothic", sans-serif;
color: #fff;
text-shadow: 0 22px 17px rgba(0, 0, 0, 0.6);
}

.contacts-title span{
    color: #f286c0;
}

.contacts-subTitle{
    font-weight: 600;
font-size: 16px;
line-height: 100%;
text-transform: uppercase;
text-align: center;
padding-top: 25px;
padding-bottom: 15px;
color: #fff;
}

.contacts-nav{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 0;
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
}

.contacts-nav a{
font-weight: 400;
font-size: 14px;
line-height: 143%;
gap: 3px;
color: #fff;
display: flex;
align-items: center;
}

.contacts-nav a img{
    width: 12px;
    height: 12px;
}

.suport{
font-weight: 400;
font-size: 12px;
line-height: 167%;
color: #cacaca;
text-align: center;
}

.privacy{
font-weight: 400;
padding-top: 15px;
font-size: 14px;
line-height: 179%;
text-decoration: underline;
text-decoration-skip-ink: none;
text-align: center;
color: #cacaca;
}


.foot_text {
    font-size: 20px;
}

.small_ft p {
    font-size: 10px;
}

.footer_img {
    margin-top: -3rem;
}

@media (max-width: 400px) {
    .who-info {
        height: 190px;
    }

}



.footerButton{
    border-radius: 130px;
max-width: 320px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin: 0 auto;
height: 65px;
background: linear-gradient(180deg, #fb53ad 0%, #f18fc3 100%);
}

.footerButton p{
font-weight: 700;
font-size: 22px;
line-height: 132%;
text-transform: uppercase;
text-align: center;
color: #fff;
}

.footerButton span{
font-weight: 700;
font-size: 10px;
line-height: 290%;
text-transform: uppercase;
text-align: center;
color: #fff;
}



.why .mainTitle{
        font-size: 60px;
    }


@media(max-width: 440px) {
    .why .mainTitle{
        font-size: 50px;
    }
}

@media(max-width: 380px) {
    .why .mainTitle{
        font-size: 45px;
    }

    .whyTitl3{
        font-size: 20px;
    }

    .why-items-item:nth-child(1) img {
        width: 63px;
        height: 45px;
        margin-top: 10px;
    }

    .why-items-item:nth-child(2) img {
        width: 70px;
        height: 45px;
        margin-top: 10px;
    }

    .why-items-item:nth-child(3) img {
        width: 55px;
        height: 45px;
        margin-top: 10px;
    }
}



@media(max-width: 440px) {
    .priceBlock {
        bottom: 30%;
        transform: translate(-50%, -50%) scale(0.95);
    }
}

@media(max-width: 430px) {
    .priceBlock {
        bottom: 31%;
        transform: translate(-50%, -50%) scale(0.90);
    }

    .why{
        min-height: 700px;
    }
}

@media(max-width: 420px) {
    .priceBlock {
        bottom: 32%;
        transform: translate(-50%, -50%) scale(0.90);
    }

}
@media(max-width: 410px) {
    .priceBlock {
        bottom: 33%;
        transform: translate(-50%, -50%) scale(0.85);
    }
    

    .header {
        min-height: 630px;
    }

    .why{
        min-height: 670px;
    }
}


@media(max-width: 400px) {
    .priceBlock {
        bottom: 31%;
        transform: translate(-50%, -50%) scale(0.80);
    }

    .why{
        min-height: 650px;
    }


    .title {
        font-weight: 300;
        font-size: 60px;
        line-height: 75%;
    }

    .subtitle {
        font-size: 22px;
        line-height: 84%;
        width: 268px;
        height: 33px;
    }

    .header__top-left {
        font-weight: 600;
        font-size: 10px;
        line-height: 133%;
        width: 140px;
        height: 34px;
    }

    .header__top-right {
        font-weight: 500;
        font-size: 10px;
        line-height: 133%;
        width: 125px;
        height: 34px;
    }

    .heeader-infoText {
        font-size: 14px;
    }

    .bonus-title {
        font-size: 30px;
        line-height: 106%;
        padding-bottom: 15px;
    }

    .bonus-subTitle {
        font-weight: 700;
        font-size: 12px;
        line-height: 179%;
        padding-bottom: 7px;
    }

    .bonus-text {
        font-weight: 500;
        font-size: 12px;
        line-height: 129%;
    }
}

@media(max-width: 400px) {
    .priceBlock {
        bottom: 29%;
        transform: translate(-50%, -50%) scale(0.80);
    }

    .header {
        min-height: 600px;
    }
}

@media(max-width: 390px) {
    .priceBlock {
        bottom: 29%;
        transform: translate(-50%, -50%) scale(0.80);
    }

    .header {
        min-height: 600px;
    }
}

@media(max-width: 385px) {
    .priceBlock {
        bottom: 31%;
        transform: translate(-50%, -50%) scale(0.80);
    }

    .why{
        min-height: 630px;
    }
}

@media(max-width: 380px) {
    .priceBlock {
        bottom: 31%;
        transform: translate(-50%, -50%) scale(0.80);
    }
}

@media(max-width: 375px) {
    .priceBlock {
        bottom: 31%;
        transform: translate(-50%, -50%) scale(0.80);
    }
}

@media(max-width: 370px) {

    .why{
        min-height: 600px;
    }

    .priceBlock {
        bottom: 30%;
        transform: translate(-50%, -50%) scale(0.80);
    }

    .header {
        min-height: 570px;
    }
}

@media(max-width: 360px) {
    .why{
        min-height: 570px;
    }

    .priceBlock {
        bottom: 29%;
        transform: translate(-50%, -50%) scale(0.75);
    }

    .header {
        min-height: 560px;
    }
}

@media(max-width: 350px) {
    .priceBlock {
        bottom: 30%;
        transform: translate(-50%, -50%) scale(0.75);
    }

    .header {
        min-height: 550px;
    }
}

@media(max-width: 340px) {
    .priceBlock {
        bottom: 32%;
        transform: translate(-50%, -50%) scale(0.75);
    }
}

.why {
        background-size: 100% 100%;
        min-height: 699px;
        padding: 30px 10px 20px 10px;
    }
    @font-face {
        font-family: "MyCustomFont";
        src: url("../fonts/steelfish_bd.ttf") format("truetype");
        font-weight: normal;
        font-style: normal;
    }
    .title{
        font-family: "MyCustomFont", sans-serif;
    }
    .asksContainer-item-bottom p{
        max-width: 100%;
    }
    .price-bottom span{
        opacity: 0.8;
    }
    .sign-up-button{
        background-image: url(../assets-2/buttonbg.png);
        height: 80px;
        position: relative;
    }
    
    .sign-up-button:after{
        content: "";
    display: block;
    position: absolute;
    border-radius: 20px;
    width: 140px;
    height: 80px;
    backdrop-filter: blur(3px);
    right: 0px;
    overflow: hidden;
    top: -60px;
    border-top: 1px solid #ffffff80;
    border-bottom: 1px solid #ffffff80;
    background-color: rgb(20 20 20 / 10%);
    transform: rotate(9deg);
    z-index: 7;
    }
    .sign-up-button:before{
        content: "";
        display: block;
        position: absolute;
        border-radius: 7px;
        width: 132px;
        height: 111px;
        right: 5px;
        top: -50px;
        background-image: url(../assets-2/gift.png);
        background-size: 132px;
        background-repeat: no-repeat;
        animation: shake 2s ease-in-out infinite;
        transform: rotate(2deg);
        z-index: 9;
    }
    @keyframes shake {

    0%,
    10%,
    100% {
        transform: translate(0, 0);
    }

    15% {
        transform: translate(-1px, 0);
    }

    20% {
        transform: translate(1px, 0);
    }

    25% {
        transform: translate(-1px, 0);
    }

    30% {
        transform: translate(1px, 0);
    }

    35% {
        transform: translate(-1px, 0);
    }

    40% {
        transform: translate(1px, 0);
    }

    45% {
        transform: translate(0, 0);
    }
}
    .why{
            background-size: 100% 100%;
    }
    .slider-button {
        backdrop-filter: blur(13px);
        pointer-events: none;
    }
    .upgraded {
            padding: 50px 0px 20px 0;
        }
        
        .inside-content-items {
            display: flex;
            align-items: flex-start;
            flex-wrap: nowrap;
        }
    .header__top-right,
    .header__top-left{
        font-size: 11px;
        /*white-space: nowrap;*/
    }

    .programs-item-title{
        padding: 0 15px;
    }
    .days {
        padding: 0 10px;
        flex-wrap: nowrap;
        display: grid;
        grid-template-columns: repeat(2, 170px);
        gap: 10px;
    }
    .day-text {
        padding: 10px 5px 10px 25px;
    }

        .sign-up{
            cursor: pointer;
            transition: .3s;
            z-index: 9;
        }
        
        .sign-up:hover{
            transform: scale(1.02);
        }
        
        .sign-up:active{
            transform: scale(0.98);
        }
        .why-items{
            padding: 20px;
        }
        .why-items-item{
            gap: 10px;
        }
        .bonus-gift{
            animation: shake 2s ease-in-out infinite;
        }
        
        #prev::after,
        #next::after {
            background-position: center;
            height: 10px;
            width: 20px;
        }


        
        @keyframes shake {
            0%, 10%, 100%   { transform: translate(0, 0); }
            15%  { transform: translate(-1px, 0); }
            20%  { transform: translate(1px, 0); }
            25%  { transform: translate(-1px, 0); }
            30%  { transform: translate(1px, 0); }
            35%  { transform: translate(-1px, 0); }
            40%  { transform: translate(1px, 0); }
            45%  { transform: translate(0, 0); }
        }