@media screen and (max-width: 991px) {
    body{margin:0;padding:0!important;box-sizing:border-box;text-align:center}
    h3{font-size:1.2rem}
    .nav-toggle{margin-right:20px;display:block;margin-bottom:20px}
    .main-nav{overflow:initial;margin-bottom:20px}
    .nav-links{position:fixed;background-color:transparent;backdrop-filter:blur(8px);left:-100%;top:50px;width:100%;padding-block:20px;transition:.2s ease-out}
    .nav-links.active{left:0}
    .nav-links ul{flex-direction:column}
    .hero-card-section{width:100%;margin:0;padding:0}
    .hero-head{width:100%}
    .top-profile-name{margin-left:0}
    .top-profile-name span{margin:0}
    .gallery{width:100%;padding:20px}
    .box{grid-row:span 1;grid-column:span 3}
    .faq-section{background:none}
    .faqs{max-width:100%;padding:45px 60px}
    .faqs .image-box{height:360px;width:100%}
    .faqs .faqs-text{width:63%}
    .FAQ-section{padding-block:10px}
    .col{flex:100%;max-width:100%}
    .inner{padding:0}
    .blogs-area{gap:20px}
    .blogs-card{width:calc(50% - 10px);height:200px}
    .services{width:100%}
    .social1{margin-left:0;}

                                 /* BLOG PAGE MEDIA QUERIES */

.blog-page-head{flex-direction:column;justify-content:center;align-items:center;width:100%}
.blog-page-head h1{width:100%}
.blog-page-head p{width:100%}
.blog-page-section1,.blog-page-section2{flex-direction:column}
.blog-page-content1{width:100%;padding:0 30px}
.blog-page-section2{gap:0;padding:0;padding-bottom:40px}

/* ------------------------------------------- BLOGS MEDIA QUERIES ------------------------------------------- */

.blog-home-card{width:40%}
.blog-home img{height:60%}
.blog-home a{transition:none;transform:none}
.blog-hero-head{width:80%}

/* ------------------------------------------- CATEGORIES MEDIA QUERIES ------------------------------------------- */

.categories-hero-head{width:100%}

/* ------------------------------------------- LOCALITY MEDIA QUERIES ------------------------------------------- */

.locality-hero-head{width:100%}
.carousel img{width:calc(100% / 2)}

/* ------------------------------------------- BLOGS MEDIA QUERIES ------------------------------------------- */

/* ------------------------------------------- BLOGS MEDIA QUERIES ------------------------------------------- */


}

@media screen and (max-width: 767px) {
    .primary-button{width:100%}
    .hero{display:flex;flex-direction:column;justify-content:center;align-items:center}
    .hero-head{flex-direction:column;width:100%}
    header{height:auto;margin-bottom:20px}
    .hero-card-sec{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;margin-bottom:40px}
    .feature-card{min-width:calc(50% - 10px)}
    .carousel img{width:calc(100% / 2)}
    .top-profile-container{flex-direction:column}
    .top-profiles-section{height:100%}
    .profile-image{width:100%;background-image:url(Assest/etienne-girardet-Xh6BpT-1tXo-unsplash.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;margin:0;border-radius:0}
    .profile-image img{margin:20px 0}
    .profile-description{padding:10px;background:transparent;margin:0;width:100%}
    .first-image{flex-direction:column-reverse}
    h2{font-size:2rem}
    .categories{flex-direction:column}
    .content{height:230px;opacity:1;top:17%}
    .content p{margin-top:10px}
    .section{width:100%;height:230px;margin-bottom:60px}
    .section h3{font-size:28px}
    .section:hover .content{transform:translateY(-17.5%)}
    .blogs-card{width:250px}
    .col{flex:100%;max-width:100%}
    .services{width:100%}
    .blogs-card{width:100%}
    .profile-card{width:calc(50% - 20px)}
    #toggle-arrow i{margin-left:0}

/* ------------------------------------------- CATEGORIES MEDIA QUERIES ------------------------------------------ */

.categories-hero{display:flex;flex-direction:column;justify-content:center;align-items:center}
.categories-hero-head{flex-direction:column;width:100%}
header{height:auto;margin-bottom:20px}
.categories-hero-card-sec{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;margin-bottom:40px}

/* ------------------------------------------- CONTACT US MEDIA QUERIES ----------------------------------------- */

.contact-us-form{grid-template-columns:1fr;padding:0}
.contact-container{padding:0}
.contact-text{text-align:center}

/* ------------------------------------------- LOCALITY MEDIA QUERIES ------------------------------------------- */

.locality-hero{display:flex;flex-direction:column;justify-content:center;align-items:center}
.locality-hero-head{flex-direction:column;width:100%}

/* ------------------------------------------- BLOGS MEDIA QUERIES ------------------------------------------- */

.location-card{width:220px;margin-top:30px;text-align:center;transition:transform .3s ease-in-out,filter .3s ease-in-out;filter:grayscale(0%);box-shadow:rgba(0,0,0,0.4) 0 30px 90px}
.location-card:hover{cursor:pointer;transform:translateY(-20px)}
.location-card img{width:200px}
.locations{padding:10px}

}

@media screen and (max-width: 479px) {
    :root{--padding-inline-section:10px}
    h1{font-size:35px}
    h2{font-size:28px}
    h3{font-size:24px}
    h4{font-size:20px}
    p{font-size:15px}
    .container p{line-height:2.2rem}
    header{padding:0}
    .hero h1{font-size:50px;margin-top:20px}
    .hero p{text-align:center;margin-top:1cqw}
    .hero-card{width:130px;height:180px}
    .feature-card img{width:140px}
    .feature-card{min-width:calc(50% - 30px);height:550px}
    .carousel img{width:100%}
    .profile-image{width:100%;background-image:url(Assest/etienne-girardet-Xh6BpT-1tXo-unsplash.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;margin:0;border-radius:0}
    .profile-image img{margin:20px 0}
    .profile-description{padding:10px;background:transparent;margin:0;border-radius:0}
    .services{width:100%}
    .blogs-card{width:100%}
    .profile-card{width:calc(50% - 20px);max-width:none}
    .faq-section{background:none}
    .faq-right{padding:0;margin:0;margin-top:40px}
    .title{text-align:center}
    .faqs{padding:25px}
    .faqs-text li p{width:98%}
    .gallery{width:100%;padding:30px;gap:20px}
    .image-list img{width:100%}
    .box{grid-row:span 2;grid-column:span 3}
    .content{height:350px}
    .content p{line-height:1.3rem}
    .section{height:350px}
    .section h3{font-size:25px}
    .button{width:150px}
    footer{flex-direction:column;padding:30px;gap:40px;align-items:center}
    .links{width:100%}
    .social{display:flex;justify-content:center;align-items:center}
    .social a{margin:15px}
    .fa-square-facebook{color:#1877F2}
    .fa-instagram{color:#C13584}
    .fa-twitter{color:#1DA1F2}
    .fa-pinterest{color:#E60023}
    .social{display:block;}
    .fa-youtube{color:#FF0000;}
    .subfooter{flex-direction:column;gap:20px;}
    .copyright{justify-content:center;}

/* ------------------------------------------- BLOG PAGE MEDIA QUERIES ------------------------------------------- */

.blog-page-head h1{font-size:50px}
.blog-sec h2{font-size:32px;width:100%;padding:40px 5px}
.blog-page-border{width:80%;margin-bottom:60px}
.blog-page-image1 img{width:100%;padding:10px}
.blog-page-content1{width:100%;padding:0 5px;text-align:center}
.blog-page-section2{gap:0;padding:0;padding-bottom:40px;padding-top:0}
.blog-page-heading3{height:fit-content}
.blog-page-content3{padding:5px 10px;text-align:center}

/* ------------------------------------------- BLOGS MEDIA QUERIES ------------------------------------------- */

.blog-home-card{width:90%}
.blog-home-head{width:95%}

/* ------------------------------------------- CONTACT US MEDIA QUERIES ------------------------------------------- */

.contact-container p{line-height:2.2rem}
.information{margin:0}
.contact-info{padding:10px}
.contact-social-media p{margin:0}
.contact-social-icons{display:flex;justify-content:center;font-size:20px}

/* ------------------------------------------- LOCALITY MEDIA QUERIES ------------------------------------------- */

.locality-hero h1{font-size:50px;margin-top:20px}
.locality-hero p{text-align:center;margin-top:1cqw}

/* ------------------------------------------- LOCATIONS MEDIA QUERIES ------------------------------------------- */

.location-card{width:150px}
.location-top{height:280px;overflow:hidden}
.location-card img{width:130px}
.location-card h3{font-size:16px}
.location-card p{font-size:13px}
.locations{padding:5px;gap:10px;justify-content:center}
.explore{margin-top:-10px;padding:10px 20px;width:130px}
.explore h3{font-size:13.5px}
    
    }