@media only screen and ( max-width: 1600px) {
    .nav-bar{ padding: 5px 40px;}
}
@media only screen and ( max-width: 1440px) {
    h1{ font-size: 40px; font-weight: 500;}
    .nav-bar .logo{ width: 150px;}
}

@media only screen and ( max-width: 1350px) {
    h2{ font-size: 35px; font-weight: 600;}
    .container{ max-width: 95%;}
}
@media only screen and ( max-width: 1200px){
    .display-none{ display: none;}
}

@media only screen and ( max-width: 1150px) {
    h1{ font-size: 35px;}
    h2{ font-size: 30px; font-weight: 600;}

    .banner-section .banner-img { min-height: 350px;}
    .banner-content p{ font-size: 15px; margin-bottom: 15px;}

}

@media only screen and ( max-width: 991px) {
    h1{ font-size: 30px; font-weight: 500;}
    h2{ font-size: 24px; font-weight: 600;}

    .btn-toggle-div { display: block; }

    .footer-eq-section .footer-eq-container .footer-eq-form{ padding: 0px; margin-top: 50px;}
    footer .upper-footer .container{ display: block; justify-content: space-between;}
    footer .footer-bottom-section p { font-size: 15px; }
}


@media only screen and ( max-width: 650px){
    .ham { width: 50px; margin: -13px;}
    .mb-80{ margin-bottom: 50px;}
    .mt-80{ margin-top: 50px;}
    h1{ font-size: 30px; font-weight: 500;} 
    h2{ font-size: 20px; font-weight: 600;} 
    h3{ font-size: 17px;} 
    h4{ font-size: 15px;}
    .container{ max-width: 96%;}
    .heading{ font-size: 24px; margin-bottom: 10px;}
    .description{ font-size: 13px; margin-bottom: 10px;}
    .heading-content .description br{ display: none;}

    .owl-dot { width: 8px; height: 3px; margin-top: 20px !important;}
  
    .nav-bar{ padding: 12px 14px;}
    .nav-bar .logo{ width: 115px;}

    .button { padding: 0px 0px;}
    .button a { font-size: 11px;  padding: 8px 15px;}

    .banner-section .banner-img{ min-height: 220px; padding: 60px 0px;}
    .banner-section .banner-content{ position: static; width: 100%; top: 0; left: 0; transform: translatex(0); text-align: center; padding: 15px 10px 20px 10px; background-color: #555555;}
    .banner-content h1{ margin-bottom: 5px;}
    .banner-content p{ margin-bottom: 15px; font-size: 13px;}
    .banner-content:hover .unique-text::before{ height: 26px; }

    .form-heading { display: inline-block; font-size: 15px;}
    .form-control{ margin-top: 0px; padding: 7px 15px; font-size: 13px; border: 1px solid var(--thm-footer);}
    .form-select { margin-top: 0px; padding: 7px 15px; font-size: 13px; border: 1px solid var(--thm-footer);}
    .form-select:focus { border: 1px solid transparent;}
    .form-control:focus { border: 1px solid transparent;}

    .footer-eq-section .container{ max-width: 100%;}
    .footer-eq-section .footer-eq-container { padding: 20px 20px 20px 20px; border-radius: 10px 10px 0px 0px; margin: 0px;}
    .footer-eq-section .footer-eq-container .footer-eq-form { margin-top: 0px;}

    footer .upper-footer{ padding: 30px 0px;}
    footer .upper-footer .footer-logo img{ max-width: 130px; margin-top: 10px;}
    footer .upper-footer .footer-gird{ display: flex; gap: 5px; margin-bottom: 10px;}
    footer .upper-footer .footer-gird a{ font-size: 13px;}
    .footer-bottom-section{ padding: 20px 0px; }
    footer .footer-bottom-section p { font-size: 12px; }

    footer .upper-footer h2{ font-size: 22px; margin: 10px 0px;}
    footer .upper-footer h4{ margin-top: 30px;}
    footer .upper-footer .footer-contact a{ font-size: 13px;}

    .social-media{ margin-bottom: 15px;}
    .social-media a i{ font-size: 18px; padding: 8px 8px; border-radius: 4px;}

    #back-to-top-button { width: 38px; height: 38px; bottom: 25px; right: 20px; }
    #back-to-top-button::after { font-size: 18px; line-height: 40px; }
    
}