@media screen and (max-width: 576px) {

    /* header-starts */
    header {
        margin-bottom: 0;
    }
    .menu {
        display: none;
    }
    .menu-mob {
        display: flex;
        align-items: center;
    }
    .menu-mob button {
        border: none;
        display: flex;
        background: transparent;
        justify-content: center;
    }
    .menu-mob button img {
        height: 24px;
        width: 24px;
        cursor: pointer;
    }
    nav {
        min-height: 43px;
        margin-top: 52px;
        padding: 0 20px;
        margin-bottom: 51px;
    }
    .header-intro {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
    }
    .header-intro-left {
        max-width: 100%;
        padding: 0 20px;
        min-height: auto;
    }
    .header-intro-left h1 {
        font-size: 36px;
        font-weight: 900;
    }
    .header-intro-left h1 span {
        font-size: 72px;
    }
    .header-intro-left p br {
        display: none;
    }
    .btn-group {
        margin-bottom: 48px;
    }
    .btn-group a {
        padding: 0;
        display: flex;
        width: 169px;
        height: 54px;
        justify-content: center;
        align-items: center;
    }
    .btn-group a:hover {
        padding: 0;
    }
    .header-intro-right {
        max-width: 100%;
        min-height: auto;
        padding: 0 20px;
    }
    .box-1 h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 3px;
    }
    .box-1 p {
        font-size: 10px;
        line-height: 15px;
    }
    .box-1 {
        left: 54%;
        top: 11%;
        padding: 12px 17px 11px 18px;
    }
    .box-2 .text h2 {
        font-size: 18px;
        line-height: 18px;
        margin-bottom: 5px;
    }
    .box-2 .text p {
        font-size: 12px;
        line-height: 18px;
    }
    .box-2 .circle {
        height: 30px;
        width: 30px;
    }
    .box-2 .circle img {
        width: 15px;
        height: 15px;
        margin-left: 9px;
    }
    .box-2 {
        left: 9%;
        top: 46%;
        gap: 9px;
        padding: 15px 17px;
    }
    /* header-ends */

    /* your-habits-starts */
    .your-habits {
        margin-bottom: 66px;
    }
    .habits-text h2 {
        font-size: 32px;
    }
    .habits-text p br {
        display: none;
    }
    .img-section {
        gap: 36px;
        flex-direction: column;
        align-items: center;
    }
    /* your-habits-ends */

    /* run-an-extra-starts */
    .run-an-extra {
        margin-bottom: 66px;
        padding: 0 20px;
    }
    .run-an-extra .container {
        min-height: auto;
        padding: 31px 33px 35px 33px;
        flex-direction: column;
    }
    .run-an-extra-left h2 {
        font-size: 32px;
    }
    .run-an-extra-left p {
        margin-bottom: 24px;
    }
    .run-an-extra-left p br {
        display: none;
    }
    .run-an-extra-left a {
        padding: 0;
        max-width: 287px;
        height: 54px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .run-an-extra-left {
        min-height: auto;
        margin-bottom: 31px;
        width: 100%;
    }
    .run-an-extra-right {
        width: 100%;
        height: auto;
    }
    /* run-an-extra-ends */

    /* uniq-sec-starts */
    .uniq-section {
        margin-bottom: 66px;
    }
    .uniq-section .container {
        min-height: auto;
        padding: 0 20px;
    }
    .monthly-feature {
        max-width: 100%;
        margin: 0 auto;
        margin-bottom: 60px;
    }
    .monthly-feature h2 {
        font-size: 27px;
        margin-bottom: 10px;
    }
    .monthly-feature p {
        font-size: 12px;
        line-height: 20px;
    }
    .feature-cards {
        flex-direction: column;
        align-items: center;
        gap: 45px;
    }
    /* uniq-sec-ends */

    /* bmi-calculator-starts */
    .bmi-calculator {
        margin-bottom: 66px;
    }
    .bmi-intro h2 {
        font-size: 32px;
    }
    .bmi-intro p br {
        display: none;
    }
    .bmi-intro {
        max-width: 100%;
        min-height: auto;
        margin-bottom: 32px;
        padding: 0 20px;
    }
    .bmi-calculator-main .container {
        min-height: auto;
        align-items: normal;
        flex-direction: column;
        padding: 34px 20px 59px 20px;
    }
    .bmi-calculator-left {
        min-height: auto;
        margin-bottom: 42px;
    }
    .bmi-calculator-left h2 {
        font-size: 16px;
        margin-bottom: 23px;
    }
    .bmi-calculator-right h2 {
        font-size: 16px;
        margin-bottom: 14px;
    }
    .bmi-calculator-right {
        width: 100%;
        min-height: auto;
    }
    .bmi-calculator-right p br {
        display: none;
    }
    .bmi-calculator-right a {
        padding: 0;
        max-width: 224px;
        height: 54px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    /* bmi-calculator-ends */

    /* meet-our-team-starts */
    .our-team-intro {
        max-width: 100%;
        min-height: auto;
        margin-bottom: 37px;
        padding: 0 20px;
    }
    .our-team-intro h2 {
        font-size: 32px;
    }
    .our-team-intro p br {
        display: none;
    }
    .our-team-gallery {
        padding: 0 20px;
    }
    .our-team-gallery .container {
        grid-template-columns: repeat(1, 1fr);
        min-height: auto;
    }
    .our-team-gallery .container .photo-card {
        width: 100%;
        height: auto;
        aspect-ratio: 5 / 4;
    }
    .our-team-gallery .container .photo-card img {
        width: 100%;
        aspect-ratio: 1 / 2;
        border-radius: 18px;
        object-fit: cover;
    }
    .our-team-gallery .container .photo-card img {
        width: 100%;
        height: 100%;
    }
    .photo-card .text h2 {
        font-size: 18px;
    }
    .meet-our-team {
        margin-bottom: 66px;
    }
    /* meet-our-team-ends */

    /* footer-starts */
    footer {
        background: rgba(255, 255, 255, 0.1);
        min-height: auto;
        padding: 0 20px;
    }
    .footer-top {
        margin-top: 44px;
        margin-bottom: 72px;
        min-height: auto;
        flex-direction: column;
    }
    .footer-right {
        width: 100%;
        min-height: auto;
        flex-direction: column;
        gap: 20px;
    }
    .footer-left p {
        margin-bottom: 30px;
    }
    .footer-left p br {
        display: none;
    }
    .footer-menu ul li a {
        line-height: 40px;
    }
    /* footer-ends */
}