h2 {
    margin: 0;
}

.flex-container {
    display: flex;
    gap: 24px;
}
.flex-left, .flex-right {
    width: 50%;
}


/*HERO*/
#managed-services .wrapper {
    max-height: 320px;
    overflow: hidden;
}

.wrapper .container.ms-hero {
    padding-bottom: 0;
    padding-top: 0;
    max-height: 320px;
}

.ms-hero .flex-left {
    display: flex;
    flex-direction: column;
    justify-content: center;

}

.anchor-links {
    font-size: 22px;
    list-style-type: disc;
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-left: 18px;
    font-weight: 400;
    
}

.light-theme .anchor-links {
    color: var(--color-blue-40);
}

.light-theme .anchor-links li {
    color: var(--color-blue-40);
}

.dark-theme .anchor-links li {
    color: var(--color-blue-70);
}


.mdr-img {
    width: 100%;
}
.mdr-img img {
    width: 100%;
}

/*Learn Section*/
#section-learn .flex-container {
    gap: 48px;
    padding: 48px 0;
    font-size: 20px;
}

#section-learn h2 {
    font-size: 28px;
}


#section-learn .flex-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-height: 490px;
}

#section-learn .qsg-box {
    border-radius: 16px;
}

#section-learn .qsg-box p {
    margin: 0;
    padding: 18px 18px 0px 18px;
}

#section-learn .box-heading {
    font-size: 24px;

    display: flex;
    gap: 16px;
    padding: 18px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.light-theme #section-learn .box-heading  {
    background-color: #F8F8F8;
}
.dark-theme #section-learn .box-heading  {
    background-color: var(--color-gray-30);
}



#section-learn ul {
    display: flex;
    flex-direction: column;
    gap: 36px;
    margin: 24px;
    padding: 18px;
    list-style-type: disc;
}

.light-theme .icon-mwb-arrow-right {
    background-color: var(--color-blue-40);
    color: #fff;
    border-radius: 100px;
    padding: 3px;
}

.dark-theme .icon-mwb-arrow-right {
    background-color: var(--color-blue-70);
    color: #000;
    border-radius: 100px;
    padding: 3px;
}

@media (max-width:768px) {
    .icon-mwb-arrow-right{
        display: none;
    }

    #section-learn .flex-container {
        gap: 0;
    }
}

.light-theme #section-learn ul li {
    color: var(--color-blue-40);
}


.mdr-schedule, .mth-schedule {
    padding: 36px 5%;
}

#mdr-schedule, #mth-schedule {
    scroll-margin-top: 100px;
  }


.mdr-schedule section, .mth-schedule section {
    display: flex;
    flex-direction: row;
    gap: 24px;
    width: 100%;
    padding: 2% 0;
}

.mdr-schedule > h2, .mth-schedule > h2 {
    font-size: 32px;
    margin: 0;
}

.mdr-schedule h2 span, .mth-schedule h2 span {
    display: block;
    font-size: 28px;
}

.mdr-schedule .content-wrapper, .mth-schedule .content-wrapper {
    text-align: left;
}

.block-wrapper {
    display: flex;
    gap: 24px;
    justify-content: center;
    padding: 0 24px;
}

.block-wrapper div {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 24px;
    border-radius: 8px;
    gap: 18px;
}


.mdr-container .flex-right h3, .mth-container .flex-right h3 {
    text-align: center;
    font-size: 24px;
    
}

.header-wrapper {
    display: flex;
    gap: 16px;
}

.block-wrapper div h4 {
    margin: 0;
    text-align: center;

}

.block-wrapper div span {
    font-weight: 500;
    font-size: 20px;
    text-align: center;
}

.explore-ms {
    text-align: center;
    padding: 48px 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.explore-wrapper {
    display: flex;
    gap: 24px;
    justify-content: center;
    
}

.explore-block {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    border: 4px solid var(--color-blue-80);
    width: 320px;
    text-align: center;
    border-radius: 16px;
    padding: 24px;
    cursor: pointer;
}

.light-theme .explore-block:hover {
    background-color: var(--color-blue-99);
}

.explore-block .icon {
    font-size: 36px;
    color: var(--color-blue-50);
}
.explore-block h3 {
    font-size: 22px;
}
.explore-block h3 a {
    text-decoration: none;
}
.light-theme .explore-block h3 a {
    color: var(--color-black);
    text-decoration: none;
}

.light-theme .block-wrapper div h3 {
    color: var(--color-blue-40);
}

.dark-theme .block-wrapper div h3 {
    color: var(--color-blue-80);
}

.light-theme .block-wrapper div h4 {
    color: var(--color-blue-40);
}

.dark-theme .block-wrapper div h4{
    color: var(--color-blue-80);
}

.light-theme .mdr-container .block-wrapper div {
    background-color: var(--color-white);
}

.dark-theme .mdr-container .block-wrapper div {
    background-color: var(--color-black);
}
.light-theme .mth-container .block-wrapper div {
    background-color: var(--color-blue-80);
}

.dark-theme .mth-container .block-wrapper div {
    background-color: var(--color-black);
}


.light-theme .mdr-container {
    background-color: #F3F3F3;
}

.dark-theme .mdr-container {
    background-color: var(--color-gray-30);
}

.light-theme .mth-container {
    background-color: var(--color-blue-95);
}

.dark-theme .mth-container {
    background-color: var(--color-gray-40);
}

.light-theme #section-learn .qsg-box {
    border: 4px solid var(--color-blue-90);
}   

.dark-theme #section-learn .qsg-box {
    border: 4px solid var(--color-blue-90);
}   


@media (max-width: 768px) {

    .flex-container {
        flex-direction: column;
        
    }

    #section-learn .flex-container {
        padding: 24px 0 ;
    }
    .flex-container .flex-left, .flex-container .flex-right {
        width: 100%;
    }
    .block-wrapper {
        flex-direction: column;
        padding: 0;
        align-items: center;
    }

    #section-learn .flex-right {
        padding: 18px;
    }

    .block-wrapper div {
        width: 100%;
        max-width: 341px;
    }

    .explore-wrapper {
        flex-direction: column;
        gap: 18px;
        align-items: center;
    }

    .explore-wrapper div {
        width: 80%;
    }

    

    #managed-services .wrapper {
        max-height: unset;
        overflow: visible;
    }

    .ms-hero .flex-right, .ms-hero .flex-left {
        width: 100%;
    }
    .wrapper .container.ms-hero {
        max-height: unset;
    }
    .mdr-schedule, .mth-schedule {
        padding: 36px 5%;
    }

    .mdr-container .flex-container, .mth-container .flex-container {
        flex-direction: column;
    }

    .header-wrapper {
        flex-direction: column;
        text-align: center;
    }

    .content-wrapper p {
        text-align: center;
    }

}
@media (max-width: 972px) and (min-width: 769px){
    .ms-hero .flex-right {
        width: 40%
    }
    .mdr-schedule, .mth-schedule {
        padding: 36px 5%;
    }

    .ms-hero .flex-right .mdr-img {
        height: 300px;
    }
    .ms-hero .flex-right .mdr-img img {
        height: 100%;
        width: auto;
    }

    .ms-hero .flex-left {
        width: 60%
    }
}