/*Global*/
html {
    overflow-x: hidden;
}
body {
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}
h1,
h2,
h3{
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}
.section-padding-top{
    padding-top: 80px;
}
.section-padding-bottom{
    padding-bottom: 80px;
}
.section-padding-bottom-56{
    padding-bottom: 56px;
}
.section-wrap{
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}
.small-section-wrap{
    max-width: 746px;
    margin-left: auto;
    margin-right: auto;
}
.section-gap{
    gap: 60px;
}
/* Custom fonts*/
.font-size-12{
    font-size: 12px !important;
    line-height: 16px !important;
}
.font-size-14{
    font-size: 14px !important;
    line-height: 20px !important;
}
.font-size-16{
    font-size: 16px !important;
    line-height: 20px !important; 
}
.font-size-20{
    font-size: 20px !important;
    line-height: 20px !important;
}
.font-size-22{
    font-size: 22px !important;
    line-height: 20px !important;
}
.font-size-28{
    font-size: 28px !important;
    line-height: 39px !important;
}
.font-size-48{
    font-size: 48px !important;
    line-height: 58px !important;
}
/*Custom color*/
.color--white{
    color: #FFFFFF;
}
.color--blue{
    color: #007AD1;
}
.color--teal{
    color: #28958A;
}
.color--orange{
    color: #FF7463;
}
.color--dark--blue{
    color: #15102B;
}
.color--white--90{
    color: #FFFFFFE6;
}
.color--black--50{
    color: rgba(0, 0, 0, 0.5);
}
.color--black--60{
    color: rgba(0, 0, 0, 0.6);
}
.color--black--70{
    color: rgba(0, 0, 0, 0.7) !important;
}
.color--black--80{
    color: rgba(0, 0, 0, 0.8) !important;
}
.color--black--90{
    color: rgba(0, 0, 0, 0.9) !important;
}
/*Custom font*/
.font--nunito{
    font-family: "Nunito", Sans-serif !important; 
}
/*Custom font weight*/
.font--weight-600{
    font-weight: 600 !important;
}
.font--bold{
    font-weight: 900 !important;
}

section p{
    margin-top: 11px !important;
    margin-bottom: 11px !important;
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
}
section a{
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
}
.element-margin-top{
    margin-top: 48px !important;
}
/* End Global */

/*Hero*/
.hero__container{
    display: grid;
    grid-template-columns: minmax(0, 640px) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
}
.hero__column--slider,
.hero__column--content{
    min-width: 0;
}
/*Column One*/
.hero__slider{
    position: relative;
    width: 640px;
    max-width: 100%;
}
.hero__slider .slide{
    position: relative;
    width: 640px;
    height: 640px;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid var(--basics-transparent-black-100, rgba(0, 0, 0, 0.10));
background: #E9F6FB;

}
.hero__slider .hero__slide-picture{
    display: block;
}
.hero__slider .hero__slide-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    user-select: none;
}
.hero__slider .slick-arrow{
    position: absolute;
    top: 50%;
    width: 47px;
    height: 47px;
    transform: translateY(-50%);
    z-index: 3;
    font-size: 0;
    border-radius: 10px;
    border: 1.5px solid var(--basics-transparent-black-300, rgba(0, 0, 0, 0.30));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.80);
}
.hero__slider .slick-prev{
    left: -23.5px;
}
.hero__slider .slick-next{
    right: -23.5px;
}
.hero__slider .slick-arrow::before{
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 1;
}
.hero__slider .slick-prev::before{
    background-image: url("/wp-content/uploads/2026/04/left-arrow.svg");
}
.hero__slider .slick-next::before{
    background-image: url("/wp-content/uploads/2026/04/button-arrow.svg");
}
.hero__slider .tags{
    position: absolute;
    top: 16px;
    left: 16px;
    display: flex;
    gap: 8px;
}
.hero__slider .tag{
   display: flex;
   padding: 6px 16px;
   justify-content: center;
   align-items: center;
   gap: 8px;
   border-radius: 160px;
   text-transform: uppercase;
}
.hero__slider-nav{
    width: 640px;
    max-width: 100%;
    margin-top: 24px;
    overflow: hidden;
}
.hero__slider-nav .slick-list{
    overflow: hidden;
}
.hero__slider-nav .slick-track{
    display: flex;
}
.hero__slider-thumb{
    width: 160px !important;
    height: 160px;
    margin-right: 16px;
    cursor: pointer;
}
.hero__slider-thumb img{
    display: block;
    width: 160px;
    height: 160px;
    box-sizing: border-box;
    border-radius: 16px;
    border: 1px solid var(--basics-transparent-black-100, rgba(0, 0, 0, 0.10));
    object-fit: cover;
    user-select: none;
}
/*Column Two*/
.hero__column--content{
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
}
.hero .rating{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
}
.hero .rating img{
    display: block;
    width: 108px;
    height: 20px;
    object-fit: contain;
}
.hero h2{
    margin-top: 7px !important;
}
.hero .title-tag{
    margin-top: 6px !important;
    margin-bottom: 36px !important;
}
.hero .features{
    display: flex;
    flex-direction: column;
    width: 100%;
}
.hero .feature{
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 14px 0;
}
.hero .feature:not(:last-child){
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.hero .feature img{
    display: block;
    width: 24px;
    height: 24px;
    object-fit: contain;
    flex-shrink: 0;
}
.hero .tablets{
    display: flex;
    gap: 24px;
    width: 100%;
    margin-top: 31px;
}
.hero .tablets > .tablet{
    display: flex;
    align-items: center;
    gap: 16px;
    width: 248px;
    height: 64px;
    padding: 16px;
    border-radius: 16px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: #ffffff;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.10);
    cursor: pointer;
}
.hero .tablets > .tablet.selected{
    border-color: #007AD1;
    box-shadow: 0 0 0 1px #007AD1, 0 8px 16px 0 rgba(0, 0, 0, 0.10);
    background: #E9F6FB;
}
.hero .tablet-parent{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 85px;
    height: 52px;
    padding: 7px 10px 5px 9px;
    border-radius: 12px;
    border: 1px solid var(--basics-transparent-black-100, rgba(0, 0, 0, 0.10));
    flex-shrink: 0;
    background: #FFF;
}
.hero .tablet-parent img.tablet{
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.hero .tablet .info{
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.hero .tablet .text,
.hero .tablet .price{
    display: block;
}
.hero__button.button {
    display: flex;
    padding: 16px 20px 16px 24px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 10px;
    border: 1.5px solid var(--branding-yellow-yellow, #FFD235);
    background: var(--branding-yellow-yellow, #FFD235);
    box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.80);
    text-decoration: none;
    color: black;
    margin-top: 32px;
}
.hero__benefits {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    margin-top: 25px;
}
.hero__benefit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.hero__benefit-icon {
    display: block;
    object-fit: contain;
    flex-shrink: 0;
}
.hero__benefit-separator {
    color: #6F6F76;
}
.hero .card{
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    padding: 16px;
    margin-top: 64px;
    border-radius: 10px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-transparent-black-50, rgba(0, 0, 0, 0.05));
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
    box-sizing: border-box;
}
.hero .card .text{
    flex: 1 1 auto;
}
.hero .card .learn-more{
    color: #15102B;
    text-decoration: underline;
    white-space: nowrap;
}
/*Whats Included*/
.whats-included__column{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.included__accordion{
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}
.included__item{
    width: 100%;
    border-radius: 12px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
}
.included__button{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 16px;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.included__button img{
    display: block;
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}
.included__item.active .included__button img{
    transform: rotate(180deg);
}
.included__content{
    display: none;
    padding: 0 16px 16px;
}
.included__grid{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
}
.included__card .title,
.included__card .content{
    margin: 0 !important;
}
/*Banner*/
.banner__container{
    display: flex;
    border-radius: 24px;
    overflow: hidden;
}
.banner__column{
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.banner__video{
    position: relative;
    max-width: 746px;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 24px;
    overflow: hidden;
}
.banner__video iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    border-radius: 24px;
}
/*Learning Cycle*/
.learning-cycle__column{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 520px;
    border-radius: 24px;
    border: 1.059px solid var(--basics-transparent-black-100, rgba(0, 0, 0, 0.10));
    background: #E8F8F7;
}
.learning-cycle__column p{
    margin: 0px !important;
}
.cycle-container{
    position: relative;
    width: 560.734px;
    height: 480px;
}
.cycle__step{
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 220px;
}
.cycle__text__parent{
    position: relative;
    top: -9px;
}
.cycle__step .text{
    width: 100%;
    margin: 0 0 8px !important;
    text-align: center;
}
.cycle__step .tab{
    display: block;
    width: 173px;
    height: 107px;
    object-fit: contain;
}
.cycle__step .arrow{
    position: absolute;
    display: block;
    width: 69px;
    height: 51px;
    object-fit: contain;
    pointer-events: none;
}
.cycle__step--1{
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
}
.cycle__step--1 .arrow{
    top: 70px;
    right: -78px;
}
.cycle__step--2{
    top: 173px;
    right: 0;
}
.cycle__step--2 .arrow{
    right: 85px;
    bottom: -90px;
    transform: rotate(90deg);
}
.cycle__step--3{
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
}
.cycle__step--3 .arrow{
    top: 4px;
    left: -88px;
    transform: rotate(180deg);
}
.cycle__step--4{
    top: 155px;
    left: 0;
}
.cycle__step--4 .arrow{
    top: -78px;
    left: 95px;
    transform: rotate(270deg);
}
/*End Learning Cycle*/

/*Apps*/
.apps__column{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.apps p{
    margin: 0px !important;
}
.apps__grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
    width: 100%;
}
.apps__item{
    /* border-radius: 10px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
    padding: 24px; */
    display: flex;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border-radius: 16px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    min-height: 132px;

}
.apps__item-header{
    display: flex;
    align-items: center;
    gap: 16px;
}
.apps__icon{
    width: 44px;
    height: 44px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 8px;
}
.apps__item-title,
.apps__item-content{
    margin: 0 !important;
}
.apps__item-content{
    margin-top: 12px !important;
}
.apps__routine{
    width: 100%;
    margin-top: 32px;
}
.routine{
    border-radius: 12px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
    overflow: hidden;
}
.routine__button{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 16px;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.routine__icon{
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}
.routine.active .routine__icon{
    transform: rotate(180deg);
}
.routine__timeline{
    display: none;
    position: relative;
    padding: 0 16px 24px;
}
.routine__items{
    margin-top: 7px;
    display: flex;
    flex-direction: column;
    gap: 23px;
    width: 100%;
    position: relative;
    min-height: 240px;
    padding-right: 230px;
    box-sizing: border-box;
    padding-bottom: 55px;
}
.routine__item{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 21px;
}
.routine__time{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 4.001px 8px;
    border-radius: 24px;
    border: 1px solid var(--basics-transparent-black-100, rgba(0, 0, 0, 0.10));
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1;
}
.routine__text{
    display: block;
}
.moon-to-star{
    position: absolute;
    left: 6px;
    top: -11px;
    width: 58px;
    height: 370px;
    object-fit: cover;
    pointer-events: none;
    z-index: 0;
}
.poppy{
    position: absolute;
    bottom: 0px;
    right: 20px;
    width: 210px;
    height: 280px;
    object-fit: contain;
    pointer-events: none;
    z-index: 0;
}
/*End Apps*/

/*Reviews*/
.reviews{
    overflow: hidden;
    background-color: #DBF0F9;
    background-image: url('/wp-content/uploads/2026/04/white-zig-zag-pattern.svg');
    background-position: center center;
    background-repeat: repeat;
    background-size: auto;
}
.reviews__column{
    display: flex;
    flex-direction: column;
    width: 100%;
}
.reviews__title-container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    width: 100%;
}
.reviews__rating-container{
    display: flex;
    align-items: center;
    gap: 32px;
    flex-shrink: 0;
}
.reviews__rating,
.reviews__slide-rating{
    display: flex;
    align-items: center;
}
.reviews__rating{
    gap: 8px;
}
.reviews__rating img,
.reviews__slide-rating img{
    display: block;
    width: 108px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
}
.reviews__rating-text{
    text-transform: uppercase;
}
.reviews__slider{
    width: calc(100vw - max(24px, ((100vw - 1280px) / 2 + 24px)));
    max-width: none;
}
.reviews__slider .slick-list{
    overflow: visible;
    clip-path: inset(0 -100vw 0 0);
}
.reviews__slider .slick-track{
    display: flex;
}
.reviews__slide{
    width: 405px !important;
    min-height: 250px;
    border-radius: 24px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    margin-right: 32px;
    padding: 32px 32px 64px 32px;
    position: relative;
}
.reviews__slide-rating{
    justify-content: space-between;
}
.reviews__summary,
.reviews__review,
.reviews__customer{
    margin: 0 !important;
}
.reviews__summary{
    margin-top: 19px !important;
}
.reviews__review{
    margin-top: 12px !important;
}
.reviews__customer{
    position: absolute;
    left: 32px;
    bottom: 32px;
}
.reviews__controls{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    margin-top: 16px;
}
.reviews__dots,
.reviews__arrows{
    display: flex;
    align-items: center;
}
.reviews__arrows{
    gap: 16px;
    margin-left: auto;
}
.reviews__controls .slick-dots{
    position: static;
    width: auto;
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
}
.reviews__controls .slick-dots li{
    width: auto;
    height: auto;
    margin: 0;
}
.reviews__controls .slick-dots li button{
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 80px;
    background: #d9d9d9;
    font-size: 0;
}
.reviews__controls .slick-dots li button:before{
    display: none;
}
.reviews__controls .slick-dots li.slick-active button{
    width: 32px;
    height: 8px;
    background: #007AD1;
}
.reviews__controls .slick-arrow{
    position: static;
    width: 47px;
    height: 47px;
    transform: none;
    z-index: 3;
    font-size: 0;
    border-radius: 10px;
    border: 1.5px solid var(--basics-transparent-black-300, rgba(0, 0, 0, 0.30));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.80);
}
.reviews__controls .slick-prev,
.reviews__controls .slick-next{
    left: auto;
    right: auto;
    margin: 0;
}
.reviews__controls .slick-arrow::before{
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 1;
}
.reviews__controls .slick-prev::before{
    background-image: url("/wp-content/uploads/2026/04/left-arrow.svg");
}
.reviews__controls .slick-next::before{
    background-image: url("/wp-content/uploads/2026/04/button-arrow.svg");
}
/*End Reviews*/

/*Faqs*/
.faqs__column{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.faqs__accordion{
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 848px;
}
.faqs__item{
    width: 100%;
    box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid var(--basics-transparent-black-200, rgba(0, 0, 0, 0.20));
    background: var(--basics-extremes-white, #FFF);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
}
.faqs__button{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 16px;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.faqs__button-label{
    flex: 1 1 auto;
    text-align: left;
}
.faqs__icon{
    display: block;
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}
.faqs__item.active .faqs__icon{
    transform: rotate(180deg);
}
.faqs__content{
    display: none;
    padding: 0 16px 16px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow: hidden;
    margin-top: 16px;
}
.faqs__content p{
    margin: 0 !important;
    white-space: pre-line;
    font-size: 16px !important;
    line-height: 20px !important;
    color: rgba(0, 0, 0, 0.9) !important;
}
.faqs__embeds{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}
.faqs__content p + .faqs__embeds{
    margin-top: 16px;
}
.faqs__embed{
    width: 100%;
    aspect-ratio: 16 / 9;
}
.faqs__embed iframe,
.faqs__embed video,
.faqs__embed embed,
.faqs__embed object,
.faqs__content iframe,
.faqs__content video,
.faqs__content embed,
.faqs__content object{
    display: block;
    width: 100%;
    max-width: 100%;
}
.faqs__embed iframe{
    height: 100%;
}
.faqs__text-container{
    width: 100%;
    max-width: 848px;
    margin-top: 16px;
    text-align: center;
}
/*End Faqs*/
@media (min-width: 992px) {
    /*Global */
    .section-desktop-padding{
        padding-left: 24px;
        padding-right: 24px;
    }
     /*End Global */
}

@media(max-width: 991.98px){
    /*Global*/
    .mobile-section-wrap{
        max-width: 1312px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 80px;
        padding-right: 80px;
    }
    .section-desktop-padding {
        padding-left: 80px;
        padding-right: 80px;
    }
    /*End Global */

    /*Hero max-width:991.98px*/
    .hero__container{
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }
    .hero__slider{
        width: 100%;
    }
    .hero__slider .slide{
        width: 100%;
        aspect-ratio: 1 / 1;
    }
    .hero__slider-nav{
        width: calc(100vw - 80px);
        max-width: none;
    }
    .hero__column--content{
        align-items: stretch;
    }
    .hero .tablets{
        flex-wrap: wrap;
    }
    .hero .tablets > .tablet{
        flex: 1 1 248px;
    }
    /*End Hero max-width:991.98px*/

    /*Whats Included max-width:991.98px*/
    .included__grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    /*End Whats Included max-width:991.98px*/

    /*Learning Cycle max-width:991.98px*/
    .cycle-container{
        max-width: 640px;
        height: 480px;
    }
    .cycle__step--2{
        right: -20px;
    }
    .cycle__step--4{
        left: -20px;
    }
    /*End Learning Cycle max-width:991.98px*/

    /*Apps max-width:991.98px*/
    .apps__grid,
    .apps__routine{
        max-width: 100%;
    }
    .routine__items{
        min-height: 220px;
        padding-right: 190px;
    }
    .poppy{
        top: 110px;
        right: -176px;
        width: 150px;
    }
    /*End Apps max-width:991.98px*/

    /*Reviews max-width:991.98px*/
    .reviews__title-container{
        align-items: center;
        flex-direction: column;
    }
    .reviews__rating-container{
        width: 100%;
        flex-flow: column;
    }
    .reviews__slider{
        width: calc(100vw - 80px);
    }
    /*End Reviews max-width:991.98px*/

    /*Faqs max-width:991.98px*/
    .faqs__container{
        max-width: 100%;
    }
    /*End Faqs max-width:991.98px*/
}

@media (max-width: 575.98px){
    /*Global */
    .section-padding-top{
        padding-top: 32px;
    }
    .section-padding-bottom{
        padding-bottom: 32px;
    }
    .mobile-section-wrap{
        padding-left: 16px;
        padding-right: 16px;
    }
    .section-desktop-padding{
        padding-left: 16px;
        padding-right: 16px;
    }
    .section-gap{
        gap: 25px;
    }

    /* Custom fonts */
    .font-size-14{
        font-size: 12px !important;
        line-height: 18px !important;
    }
    .font-size-16{
        font-size: 14px !important;
        line-height: 20px !important; 
    }
    .font-size-22 {
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .font-size-28 {
        font-size: 20px !important;
    }
    .font-size-48{
        font-size: 36px !important;
        line-height: 44px !important;
    }

    section p {
        margin-top: 11px !important;
        margin-bottom: 11px !important;
        font-size: 16px;
    }
    section a {
        font-size: 14px;
        line-height: 25px;
        font-weight: 400;
    }
    .element-margin-top {
        margin-top: 32px !important;
    }
    a span.button__text{
        font-size: 18px;
    }
    /* End Global */

    /*Hero max-width:575.98px*/
    .hero__container.section-gap{
        gap: 32px;
    }
    .hero__slider{
        width: 100%;
        max-width: 100%;
        margin-left: 0;
    }
    .hero__slider .slide{
        width: 100%;
        height: auto;
        aspect-ratio: auto;
        border-radius: 16px;
    }
    .hero__slider .slick-prev {
      left: -10.5px;
    }
    .hero__slider .slick-next {
        right: -10.5px;
    }
    .hero__slider .hero__slide-image{
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .hero__slider-nav{
        width: calc(100vw - 16px);
        max-width: none;
        margin-top: 16px;
    }
    .hero__slider-thumb,
    .hero__slider-thumb img{
        width: 104px !important;
        height: 104px;
    }
    .hero__slider-thumb{
        margin-right: 8px;
    }
    .hero__slider-thumb img{
        border-radius: 12px;
    }
    /*Second Column*/
    .hero__slider .tags {
        top: 12px;
        left: 12px;
    }
    .hero__slider span.tag,
    .hero .rating span{
        font-size: 14px !important;
        line-height: 20px !important;
    }
    .hero h2 {
    margin-top: 2px !important;
    }
    .hero .title-tag{
        font-size: 16px !important;
        line-height: 20px !important;
        margin-bottom: 24px !important;
    }
    
    .hero .feature{
        padding: 8px 0;
    }
    .hero .tablets{
        flex-wrap: nowrap;
        gap: 16px;
        margin-top: 26px;
    }
    .hero .tablets > .tablet{
        flex: 1 1 0;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 16px;
        width: auto;
        min-width: 0;
        height: 158px;
        padding:16px;
        box-sizing: border-box;
        border-radius: 16px;
    }
    .hero .tablet-parent{
        width: 104px;
        height: 62px;
        box-sizing: border-box;
    }
    .hero .tablet .info{
        align-items: center;
        gap: 2px;
        text-align: center;
    }
    .hero .tablet .text{
        font-size: 14px !important;
        line-height: 20px !important;
    }
    .hero .tablet .price{
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .hero__benefits{
        justify-content: center;
        gap: 16px;
        margin-top: 16px;
    }
    .hero__benefit-separator{
        display: none;
    }

    .hero .card{
        margin-top: 30px;
    }
    .hero .card span.text{
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .hero .card a{
        font-size: 14px !important;
        line-height: 20px !important;
    }
    /*End Hero max-width:575.98px*/
    /*Whats Included max-width:575.98px*/
    .included__label,
    .included__card .title,
    .included__card p{
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .included__accordion{
        gap: 12px;
    }
    .included__grid{
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }
    /*End Whats Included max-width:575.98px*/
    /*Banner max-width:575.98px*/
    .banner__container{
        border-radius: 16px;
    }
    .banner__video,
    .banner__video iframe{
        border-radius: 16px;
    }
    /*End Banner max-width:575.98px*/

    

    /*Learning Cycle max-width:575.98px*/
    .learning-cycle__column{
        height: 300px;
        border-radius: 16px;
    }
    .cycle-container{
        position: relative;
        display: block;
        width: 100%;
        max-width: 320px;
        height: 274px;
    }
    .cycle__step{
        position: absolute;
        display: flex;
        flex-direction: column;
        align-items: center;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 120px;
    }

    .cycle__text__parent{
        top: -5px;
    }
    .cycle__step p{
        font-size: 12px !important;
        line-height: 16px !important;
        margin-bottom: 4px !important;
    }
    .cycle__step .tab{
        width: 90px;
        height: 56px;
    }
    .cycle__step .arrow{
        display: block;
        width: 36px;
        height: 27px;
    }
    .cycle__step--1{
        top: 6px;
        left: 50%;
        transform: translateX(-50%);
    }
    .cycle__step--1 .arrow{
        top: 36px;
        right: -41px;
    }
    .cycle__step--2{
        top: 90px;
        right: 0;
    }
    .cycle__step--2 .arrow{
        right: 44px;
        bottom: -47px;
        transform: rotate(90deg);
    }
    .cycle__step--3{
        left: 50%;
        bottom: 9px;
        transform: translateX(-50%);
    }
    .cycle__step--3 .arrow{
        top: 2px;
        left: -46px;
        transform: rotate(180deg);
    }
    .cycle__step--4{
        top: 71px;
        left: 0;
    }
    .cycle__step--4 .arrow{
        top: -41px;
        left: 49px;
        transform: rotate(285deg);
    }
    /*End Learning Cycle max-width:575.98px*/

    /*Apps max-width:575.98px*/
    .apps__grid{
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }
    .apps__item{
        padding: 16px;
        gap: 10px;
        min-height: 115px;
    }
    .apps__item-title,
    .routine__button-text{
        font-size: 16px !important;
        line-height: 20px !important;
    }
    .apps__routine{
        margin-top: 24px;
    } 
    .routine__timeline{
        padding: 0 16px 20px;
    }
    .routine__items{
        min-height: 0;
        padding-right: 0;
    }
    .routine__item{
        grid-template-columns: minmax(58px, auto) minmax(0, 1fr);
        gap: 12px;
    }
    .routine__item:first-child .poppy{
        display: none;
    }
    .routine__item:last-child .poppy{
        position: static;
        display: block;
        grid-column: 1 / -1;
        width: 160px;
        margin: 16px auto 0;
        transform: none;
    }
    /*End Apps max-width:575.98px*/

    /*Reviews max-width:575.98px*/
     .reviews__title-container{
        gap: 16px;
     }
     .reviews__rating-container{
        gap: 18px;
     }
     .reviews__rating-text,
     .reviews__date{
        font-size: 14px !important;
        line-height: 20px !important;
     }
     .reviews__summary{
        font-size: 16px !important;
        line-height: 20px !important;
        margin-top: 12px !important;
     }
    .reviews__slider{
        display: flex;
        flex-flow: column;
        gap: 8px;
        width: 100%;
        margin-top: 32px;
    }
    .reviews__controls{
        display: none;
    }
    .reviews__slide{
        width: 100% !important;
        min-height: 0;
        margin-right: 0;
        padding: 16px 16px 48px 16px;
        box-sizing: border-box;
        border-radius: 16px;
    }
    .reviews__review {
        margin-top: 8px !important;
    }
    .reviews__customer{
        left: 16px;
        bottom: 16px;
    }
    /*End Reviews max-width:575.98px*/

    /*Faqs max-width:575.98px*/
    .faqs__accordion{
        gap: 8px;
    }
    .faqs__content p{
        font-size: 14px !important;
        line-height: 20px !important;
    }
    .faqs__text-container {
        margin-top: 8px;
    }
    /*End Faqs max-width:575.98px*/
}