/* style for you slider start */

.sec-space-inside{

    padding: 50px 0px;

}

.sec-you-slider{

    border-top: 40px solid var(--yellow);

    background: #fcf7f1;

    padding-top: 0px;

}

.title-box{

    position: relative;

    margin-bottom: 30px;

}

.sec-you-slider .title-box .gradient-title{

    position: absolute;

    top: -40px;

    left: 0px;

    z-index: 2;

}

.gradient-title{

    font-size: 2rem;

    line-height: 1.5;

    text-align: center;

    font-weight: 500;

    color: var(--white);

    background: linear-gradient(to right, #e35500, #f0ab00);

    padding: 15px 40px;

    margin: 0px;

    border-bottom-left-radius: 30px;

    border-bottom-right-radius: 30px;

}

.you-slider-wrapper{

    margin-top: 30px;

}

.slider-icon{

    background: linear-gradient(to right, #fcf7f1 55%, #ffffff 45%);

    max-width: 80px;

}

.slider-icon .icon{

   font-size: 8rem;

   line-height: 0.7;

   color: var(--yellow);

}

.you-slider{

    background-color: var(--white);

    -webkit-box-shadow: 6px 9px 11px -15px rgba(0, 0, 0, 0.1);

    -moz-box-shadow: 6px 9px 11px -15px rgba(0, 0, 0, 0.1);

    box-shadow: 6px 9px 11px -15px rgba(0, 0, 0, 0.1);

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    margin: 40px 0px;

    border-radius: 20px;

    position: relative;

}

.you-carousel-wrapper{

    max-width: calc(100% - 80px);

    padding-left: 30px;

}

.you-carousel .owl-nav{

    position: absolute;

    top: -60px;

    right: 0px;

}

.you-carousel .owl-nav .owl-next{

    transform: rotate(180deg);

    margin-left: 10px;

}

.you-carousel .owl-nav .owl-prev{

    margin-right: 10px;

}

.you-carousel .slider-title{

    font-size: 1.5rem;

    line-height: 1.5;

    color: var(--form-text);

    margin-bottom: 0px;

}

/* style for you slider end */

/* style for coaching start */

.big-title{

    font-size: 2rem;

    line-height: 1.1;

    color: var(--orange);

    margin-bottom: 15px;

}

.big-text{

    font-size: 1.2rem;

    line-height: 1.5;

    color: var(--form-text);

}

.arrow-list{

    list-style: none;

    padding-left: 0px;

    margin-bottom: 0px;

}

.arrow-list li{

    position: relative;

    padding-left: 30px;

    margin-bottom: 10px;

}

.arrow-list li::before{

    content: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24.03 24.03"><defs><style> .cls-1 { fill: %23ffcd2e; } .cls-2 { fill: %23fff; } </style></defs><path class="cls-1" d="M12.02,23.25C5.82,23.25.78,18.21.78,12.02S5.82.78,12.02.78s11.24,5.04,11.24,11.24-5.04,11.24-11.24,11.24h0Z"/><g><path class="cls-2" d="M17.02,13.01H7.01c-.55,0-1-.45-1-1s.45-1,1-1h10.02c.55,0,1,.45,1,1s-.45,1-1,1h0Z"/><path class="cls-2" d="M13.68,16.35c-.25,0-.51-.1-.71-.29-.39-.39-.39-1.02,0-1.41l2.63-2.63-2.63-2.63c-.39-.39-.39-1.02,0-1.41.39-.39,1.02-.39,1.41,0l3.34,3.34c.39.39.39,1.02,0,1.41l-3.34,3.34c-.2.2-.45.29-.71.29h0Z"/></g></svg>');

    position: absolute;

    left: 0px;

    top: 50%;

    transform: translateY(-50%);

    width: 16px;

    height: 16px;

}

.rounted-image{

    border-bottom-left-radius: 35%;

    border-top-right-radius: 35%;

}

.your-coaching{

    margin-top: 20px;

}

.coaching-row{

    align-items: center;

}

.your-coaching .your-coaching-item.content{

    padding-left: 30px;

}

/* style for coaching end */

.sec-processflow{

    background-color: var(--orange);

}

.sec-processflow .sec-title{

    color: var(--white);

    text-align: center;

}

.processflow-card-wrapper{

    display: flex;

    align-items: flex-start;

    color: var(--white);

    /* gap: 20px; */

}

.processflow-card{

    color: var(--white);

    position: relative;

    padding-top: 30px;

    max-width: 25%;

}



.processflow-card::before {

    content: "";

    position: absolute;

    top: 10px;

    left: 50%;

    transform: translateX(-50%);

    width: 12px;

    height: 12px;

    border-radius: 50%;

    background-color: var(--white);

    z-index: 2;

    opacity: 0;

    animation: dotAppear 0.4s forwards;

}



@keyframes dotAppear {

    to {

        opacity: 1;

    }

}



.processflow-card:nth-child(1)::before {

    animation-delay: 0s;

}

.processflow-card:nth-child(2)::before {

    animation-delay: 0.8s;

}

.processflow-card:nth-child(3)::before {

    animation-delay: 1.6s;

}

.processflow-card:nth-child(4)::before {

    animation-delay: 2.4s;

}





.processflow-card::after {

    position: absolute;

    content: "";

    top: 15px;

    left: 50%;

    transform: translateX(0);

    height: 1px;

    width: 0;

    background: var(--yellow);

    z-index: 1;

    animation: lineGrow 0.6s forwards;

    transform-origin: left;

}

@keyframes lineGrow {

    to {

        width: 100%;

    }

}



.processflow-card:nth-child(1)::after {

    animation-delay: 0.4s;

}

.processflow-card:nth-child(2)::after {

    animation-delay: 1.2s;

}

.processflow-card:nth-child(3)::after {

    animation-delay: 2s;

}
.processflow-card:nth-child(4)::after {

    animation-delay: 2.4s;

}


.processflow-card:nth-child(5)::after {

    display: none; 

}



.processflow-card:last-child:after{

    display: none;

}

.processflow-card .card-title{

    font-size: 1.2rem;

    line-height: 1.2;

    margin-bottom: 15px;

    font-weight: 500;

    color: var(--white);

    text-align: center;

}

.processflow-card p{

    font-size: 1rem;

    line-height: 1.5;

    color: var(--white);

    margin-bottom: 0px;

    text-align: center;

}

.processflow-card .card-content{

    padding: 0px 20px;

    text-align: center;

}

.coaching-tracks-carousel .owl-nav{

    position: absolute;

    top: -60px;

    right: 0px;

}

.coaching-tracks-carousel .owl-nav .owl-next{

    transform: rotate(180deg);

    margin-left: 10px;

    background-color: #e8eaef!important;

    border-radius: 5px;

    min-width: 30px;

}

.coaching-tracks-carousel .owl-nav .owl-prev{

    margin-right: 10px;

    background-color: #e8eaef!important;

    border-radius: 5px;

    min-width: 30px;

}

.coaching-tracks-carousel .yellow-card{

    min-height: 215px;

}

.yellow-box-wrapper{

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 20px;

    margin-top: 30px;

}

.yellow-box{

    background-color: var(--yellow);

    padding: 20px;

    border-radius: 10px;

    position: relative;

    height: 100%;

    min-width: 280px;

}

.whyuplifyt-sec{

    background-color: #fcf7f1;

    border-top: 1px solid var(--yellow);

    margin-bottom: 0px;

    padding-top: 0px;

}

.whyuplifyt-sec .sub-title{

    transform: translateY(-18px);

}

.whyuplifyt-sec .sub-title::after{

    display: none;

}



@media only screen and (min-width: 320px) and (max-width: 767px){

    .your-coaching .your-coaching-item.content {

        padding-left: 15px; 

        margin-top: 30px;

    }

    .sec-processflow .sec-title {

        text-align: left;

    }

    .processflow-card-wrapper {

        flex-direction: column;

    }

    .processflow-card {

        padding-top: 5px;

        max-width: 100%;

        padding-bottom: 30px;

    }

    .processflow-card::before {

        top: 10px;

        left: 0px;

    }

    .processflow-card .card-title, .processflow-card p {

        text-align: left;

    }

    .processflow-card::after {

        top: 15px;

        left: 0px;

        height: 100%;

        width: 1px !important;

    }

    .processflow-card:last-child {

        padding-bottom: 0;

    }

    .big-title{

        font-size: 1.6rem;

    }

    .sparq-note .sparq-icon img {

        max-width: 85px;

    }

    .you-carousel .slider-title{

        font-size: 1.2rem;

        line-height: 1.5;

    }

}

/*New Chnage 2025*/
/*HomePage*/
.why-uplifyt-home-wrapper .yellow-box{
    min-width: unset;
}
.why-uplifyt-home .what-sparq-says .icon, .why-uplifyt-home .what-sparq-says{
    background-color: #fcf7f1;
}
.sec-bonus-hook{
    background-color: var(--light-gray);
}

.sec-bonus-hook-wrapper{
    padding: 1.25rem;
}

.sec-bonus-hook .bonus-hook-icon img {
    max-width: 80px;
    margin: 0 auto;
}

.sec-bonus-hook .sparq-center-section {
    text-align: center;     
}

.sec-bonus-hook .sparq-center-section ul {
    display: inline-block;    
    text-align: left;        
    margin: 0 auto;          
    padding-left: 20px;     
}



@media only screen and (min-width: 320px) and (max-width: 767px){
    .why-uplifyt-home-col{
        margin-bottom: 1rem;
    }
}