@media (max-width:1399px) {
    /* ========== Common Start ========== */
    /* ========== Common End ========== */
    
    /* ========== Other Header Start ========== */
    body { padding-top: 120px; }
    .other-header .navbar { padding-top: 12px; }
    .header .navbar .navbar-brand { width: 146px; }
    /* ========== Other Header End ========== */
    
    /* ========== Premises Start ========== */
    .premises { padding: 40px 0; }
    /* ========== Premises End ========== */

    .our-location .row >* , .about-me .row >* { padding: 0 15px; }
    .our-location .row , .about-me .row { margin: 0 -15px; }
}

@media (max-width:1199px) {
    /* ========== Common Start ========== */
    .section-spacing-55 { padding: 45px 0; }
    /* ========== Common End ========== */

    /* ========== Header Start ========== */
    /* ========== Header End ========== */
    
    /* ========== Massage Types Start ========== */
    .massage-types .btn.btn-primary { font-size: 19px; }
    /* ========== Massage Types End ========== */

    /* ========== Home Banner Start ========== */
    .home-banner .custom-dots-1 { bottom: 40px; left: 20px; }
    /* ========== Home Banner End ========== */
    
    /* ========== About Me Start ========== */
    .about-me .row { margin: 0 -15px; }
    .about-me .row >* { padding: 0 15px; justify-content: start; }
    /* ========== About Me End ========== */
    
    /* ========== Our Location Start ========== */
    .our-location .row { margin: 0 -15px; }
    .our-location .row >* { padding: 0 15px; justify-content: start; }
    /* ========== Our Location End ========== */
    
    /* ========== Treatments Start ========== */
    .treatments .treatments-content { padding: 30px 0; }
    .treatments { padding-top: 30px; }
    /* ========== Treatments End ========== */
}

@media (max-width:991px) {
    /* ========== Common Start ========== */
    .section-spacing-55 { padding: 40px 0; }

    .header:has(.show) { height: 434px; overflow: auto; }
    /* ========== Common End ========== */

    /* ========== Header Start ========== */
    .header .navbar-nav { margin-top: 30px; }
    .header .navbar .nav-item .nav-link { margin: 0 !important; padding: 16px 0; }

    .header .navbar .nav-item { border-bottom: 1px solid var(--primary-color); }
    .header .navbar .nav-item:last-child { border-bottom: unset; }

    .header .navbar .btn-container { margin-top: 10px; width: 100%; display: flex; align-items: center; justify-content: start; margin-bottom: 30px; }
    /* ========== Header End ========== */

    /* ========== Massage Types Start ========== */
    .massage-types .massage-types-content { justify-content: center; }
    .massage-types .massage-types-content .massage-types-link { width: calc(50% - 20px); margin: 0 20px 20px 0; }
    .massage-types .massage-types-content .btn { width: 100%; }
    /* ========== Massage Types End ========== */

    /* ========== Footer Start ========== */
    .footer .footer-right { justify-content: end; }
    /* ========== Footer End ========== */

    /* ========== Home Banner Start ========== */
    .home-banner .slick-dots { bottom: 20px; right: 20px; }
    .home-banner .common-heading { margin: 0 auto 30px; }

    .home-banner .common-heading .title h1 { font-size: 26px; font-weight: var(--fw-700); }
    .home-banner .common-heading .title h3 { font-size: 18px; }

    /* ========== Home Banner End ========== */

    /* ========== Home Banner End ========== */
    .our-location .left-block { margin-bottom: 30px; }
    .our-location .button-container .btn { margin-bottom: 20px; }
    .our-location.section-spacing-35 { padding: 35px 0; }

    .our-location .map-container { height: clamp(250px, 178.46px + 22.35vw, 400px); } /* height: 400px to 250px (991 to 320) */
    /* ========== Home Banner End ========== */

    /* ========== About Me Start ========== */
    .about-me .text-content { margin-bottom: 50px; }
    /* ========== About Me End ========== */
    
    /* ========== Our Location Start ========== */
    .our-location .right-block { margin-top: 0; }
    /* ========== Our Location End ========== */

    
    /* ========== Massage Detail Start ========== */
    .massage-detail .row .col-12:nth-child(2) { justify-content: start; }
    .massage-detail .text-content { margin-bottom: 30px; }
    /* ========== Massage Detail End ========== */
    
    /* ========== Premises Start ========== */
    .premises { padding: 30px 0; } 
    /* ========== Premises End ========== */
    
    /* ========== Treatments Start ========== */
    .treatments .text-content { margin-bottom: 30px; }
    /* ========== Treatments End ========== */
}

@media (max-width:767px) {
    /* ========== Common Start ========== */
    .section-spacing-35 { padding: 25px 0; }
    .our-location.section-spacing-35 { padding: 25px 0; }
    /* ========== Common End ========== */

    /* ========== Header Start ========== */
    /* ========== Header End ========== */

    /* ========== Footer Start ========== */
    .footer .footer-right ,
    .footer .footer-left  { justify-content: space-evenly; }

    .footer .footer-left { margin-bottom: 40px; }

    
    .footer .footer-right >*, 
    .footer .footer-left >* { width: 50%; }

    .footer .footer-top .footer-link-list:first-child { margin-right: 30px;  }

    .footer .footer-top .row { max-width: 500px; width: 100%; margin: 0 auto; }
    .footer .footer-top .row >* { padding: 0; }
    /* ========== Footer End ========== */
    
    /* ========== Our Location Start ========== */
    .our-location .image-content { margin-bottom: 24px; }
    /* ========== Our Location End ========== */
    
    /* ========== Massage Types Start ========== */
    .massage-types .btn.btn-primary { font-size: 18px; }
    /* ========== Massage Types End ========== */
    

    
}

@media (max-width:575px) {
    /* ========== Common Start ========== */
    body { padding-top: 103px; }
    /* ========== Common End ========== */

    /* ========== Header Start ========== */
    .header .navbar .navbar-brand { width: 120px; }
    .header .navbar .btn-container { justify-content: center; }
    /* ========== Header End ========== */

    /* ========== Footer Start ========== */
    .footer .footer-left { margin-bottom: 24px; }
    .footer .footer-bottom { justify-content: center !important; }

    .footer .footer-top ,  
    .footer .footer-bottom { padding: 20px 0; }

    .footer .footer-bottom .footer-link-list .footer-link { margin-right: 20px; }

    .footer .footer-bottom .footer-link-list { width: 100%; justify-content: space-evenly; }

    .footer .footer-top .footer-image { width: clamp(120px, 82.35px + 11.76vw, 150px); min-width: clamp(120px, 82.35px + 11.76vw, 150px); }
    /* ========== Footer End ========== */ 
    
    /* ========== Massage Types Start ========== */ 
    .massage-types .massage-types-content .massage-types-link { max-width: 300px; width: 100%; margin: 0 0 20px 0 !important; }
    .massage-types .massage-types-content .btn { margin: 0; }
    /* ========== Massage Types End ========== */ 
    

    /* ========== Home Banner Start ========== */
    .home-banner .slick-dots { bottom: 15px; right: 15px; }

    .home-banner .custom-dots-1 li.slick-active * { font-size: 26px; }
    .home-banner .custom-dots-1 li * { font-size: 20px; }
    /* ========== Home Banner End ========== */

    /* ========== About Me Start ========== */
    .about-me .image-content .images { flex-direction: column; align-items: start !important; }
    .about-me .image-content .images >* { max-width: 400px !important; width: 100%; }
    .about-me .image-content .images .image-1 { margin: 0 0 20px 0; }

    .about-me .text-content { margin-bottom: 30px; }
    .about-me .text-content .desc { margin-bottom: 20px; }
    /* ========== About Me End ========== */
    
    /* ========== Customer Reviews Start ========== */
    .customer-reviews .common-heading .desc >* { font-size: 18px; }
    .customer-reviews .slider-container { padding: 20px; }

    .customer-reviews .slider-btn-container { right: 5px; }
    /* ========== Customer Reviews End ========== */
    
    /* ========== Treatments Start ========== */
    .treatments .col-lg-3 { justify-content: center; }
    .treatments .common-heading .title { margin-bottom: 20px; }
    /* ========== Treatments End ========== */
    
    /* ========== Our Location Start ========== */
    /* ========== Our Location End ========== */
}

@media (max-width:424px) {
    /* ========== Common Start ========== */
    .common-heading .title * { font-size: 22px; margin-bottom: 8px; }
    .section-spacing-55 { padding: 30px 0; }
    /* ========== Common End ========== */

    /* ========== Header Start ========== */
    /* ========== Header End ========== */

    /* ========== Massage Types Start ========== */
    .massage-types .massage-types-content { flex-direction: column; }
    /* ========== Massage Types End ========== */

    /* ========== Footer Start ========== */
    .footer .footer-top .footer-image-container { margin-right: 10px; }
    .footer .footer-top .footer-link-list:first-child { margin-right: 10px; }
    /* ========== Footer End ========== */
    
    /* ========== Our Location Start ========== */
    .our-location .left-block { margin-bottom: 10px; }
    /* ========== Our Location End ========== */

    .customer-reviews .common-heading .desc >* { font-size: 17px; line-height: 23px; }
    .customer-reviews .common-heading .desc { margin-bottom: 16px; }

    .premises .common-heading .title * { margin-bottom: 16px; }
    .premises { padding: 20px 0; } 
}