.button-theme {
     background: var(--color-primary);
 }

 .button-theme:hover {
     background: var(--color-secondary-light);
 }

 .setting-button {
     color: var(--color-primary);
 }

 .search-area-3 .ssa {
     background: var(--color-primary);
 }

 .comon-slick .slick-prev {
     color: var(--color-primary);
 }

 .comon-slick .csi2 .slick-prev {
     color: var(--color-primary);
 }


 #full-page-search .close {
     background: var(--color-primary);
 }

 .comon-slick .slick-prev:hover {
     background: var(--color-primary);
     color: #fff;
 }

 .banner .tab-btn .nav-item .nav-link.active {
     background: var(--color-primary);
 }

 .comon-slick .slick-next {
     color: var(--color-primary);
 }

 .comon-slick .slick-next:hover {
     background: var(--color-primary);
     color: #fff;
 }

 .login-section .info h1 span {
     color: var(--color-primary);
 }

 .search-options-icon .accordion-button {
     background: var(--color-primary);
 }

 .login-section .form-section .btn-theme:hover {
     background: var(--color-secondary-light);
 }

 .login-section .form-section .btn-theme {
     background: var(--color-primary);
 }

 .subscribe-box-2 .form-inline .btn {
     background: var(--color-primary);
 }

 .compare-properties h3 a:hover {
     color: var(--color-primary);
 }

 .search-options-btn i {
     background: var(--color-primary);
 }

 .manage-table .title-container h5 a:hover {
     color: var(--color-primary);
 }

 .manage-table .title-container h6 span {
     color: var(--color-primary);
 }

 .contact-2 .contact-info i {
     color: var(--color-primary);
 }

 .search-options-btn i:hover {
     background: var(--color-secondary-light);
 }

 .our-newslatters-2 .form-inline .btn {
     background: var(--color-primary);
 }

 .our-newslatters-2 .form-inline .btn:hover {
     background: var(--color-secondary-light);
 }

 /* .subscribe-box-2 .form-inline .btn:hover {
    background: var(--color-secondary-light);
} */

 .intro-text .icon i {
     color: var(--color-primary);
 }

 .counters-3 .heading p {
     color: var(--color-primary);
 }

 .rating-area .average-rating h1 {
     color: var(--color-primary);
 }

 #page_scroller {
     background: var(--color-primary);
 }

 .checkbox-theme input[type="checkbox"]:checked+label::before {
     border: 2px solid var(--color-primary);
 }

 input[type=checkbox]:checked+label:before {
     color: var(--color-primary);
 }

 .main-title p {
     color: var(--color-secondary);
 }

 .main-title-2 p {
     color: var(--color-primary);
 }

 .blog-3 h3 a:hover {
     color: var(--color-primary);
 }

 .subscribe-box-2 .form-inline .btn {
     background: var(--color-primary);
 }

 .blog-3:hover .date {
     background: var(--color-primary);
 }

 .blog-3 .date h2 {
     color: var(--color-primary);
 }

 .blog-4 h1 {
     color: var(--color-primary);
 }

 .blog-4:hover .date {
     background: var(--color-primary);
 }

 .blog-3 .read-more-btn:hover {
     background: var(--color-primary);
     color: #fff;
 }

 .testimonial-4 .testimonial-info .carousel-indicators .active {
     background: var(--color-primary);
 }

 .blog-4 h3 a:hover {
     color: var(--color-primary);
 }

 .testimonial-2 .main-title p {
     color: #f40c43 !important;
 }

 .banner-bg-color {
     background: var(--color-primary);
 }

 .btn-theme {
     background: var(--color-primary);
     border: solid 1px var(--color-primary);
 }

 .btn-theme:hover {
     background: var(--color-secondary-light);
     border: solid 1px var(--color-secondary-light);
 }

 .btn-white-lg-outline:hover {
     color: #FFF;
     background: var(--color-primary);
     border: solid 2px var(--color-primary);
 }

 .btn-white-sm-outline:hover {
     color: #FFF;
     background: var(--color-primary);
     border: solid 2px #f40c43 !important;
 }

 .properties-amenities ul li i {
     color: #f40c43
 }

 .nav-pills .nav-link.active,
 .nav-pills .show>.nav-link {
     color: #fff;
     background-color: var(--color-primary);
 }

 .list-group-item.active {
     background-color: var(--color-primary);
     border-color: var(--color-primary);
 }

 .pricing-3::before {
     background: var(--color-primary);
 }

 .pricing-1:hover .plan-header h5 {
     color: var(--color-primary);
 }

 .service-info-3 h3 a:hover {
     color: var(--color-primary);
 }

 .pricing-1:hover .btn-outline {
     border: solid 1px var(--color-primary);
     background: var(--color-primary);
     color: #fff;
 }

 .our-newslatters-3 .contact-us-today:hover {
     color: var(--color-primary);
 }

 .pricing-1:hover .plan-list ul li i {
     color: var(--color-primary);
 }

 .pricing-1:hover .plan-header .plan-price {
     color: var(--color-primary);
 }

 .pricing-3:hover .button-theme {
     color: #f40c43 !important;
 }

 .pricing-3 .btn-outline:hover {
     color: var(--color-primary);
 }

 .login-section .form-section .checkbox-theme input[type="checkbox"]:checked+label::before {
     background-color: var(--color-primary);
     border-color: var(--color-primary);
 }

 .pricing-2 .d2 {
     color: var(--color-primary);
 }

 .pricing-3.popular .dolar {
     color: var(--color-primary);
 }

 .properties-condition ul li i {
     color: var(--color-primary);
 }

 #sidebar #dismiss {
     color: var(--color-primary);
 }

 #sidebar .sidebar-navigation .active {
     color: var(--color-primary);
 }

 #sidebar .sidebar-navigation ul li a:hover {
     color: #f40c43 !important;
 }

 .get-in-touch-box:hover i {
     color: #f40c43 !important;
 }

 .border-button-theme {
     color: var(--color-primary);
     border: 2px solid var(--color-primary);
 }

 .map-properties-btns .border-button-theme:hover {
     background: var(--color-primary);
     color: #fff !important;
 }

 .rightside-navbar li .button {
     color: #f40c43 !important;
     border: 2px solid var(--color-primary);
 }

 .rightside-navbar li .button:hover {
     background: #f40c43 !important;
 }

 .banner-detail-box .red-box {
     background: #f40c43 url(../../img/slider-detail.png) center center;
 }

 .banner-detail-box .white-box .slide-price {
     color: var(--color-primary);
 }

 .banner-detail-box .white-box .slide-location::after {
     background-color: var(--color-primary);
 }

 .search-button {
     background: var(--color-primary);
 }

 .service-info-2 .icon {
     color: var(--color-primary);
 }

 .service-info-2:hover h3 a {
     color: var(--color-primary);
 }

 .search-button:hover {
     color: #fff;
     background: var(--color-secondary-light);
 }

 .service-info-3 .icon {
     color: var(--color-primary);
 }

 .btn-outline-2 {
     border: solid 2px var(--color-primary);
     color: var(--color-primary);
 }

 .category-content h3 a:hover {
     color: var(--color-primary);
 }

 .bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
     color: var(--color-primary);
 }

 .bootstrap-select .dropdown-menu li a {
     color: var(--color-primary);
 }

 .property-box:hover .featured {
     color: #f40c43 !important;
 }

 .property-box:hover .listing-time {
     color: var(--color-primary);
 }

 .property-box-4:hover .featured {
     color: #f40c43 !important;
 }

 .property-box-4:hover .listing-time {
     color: var(--color-primary);
 }

 .property-box-4 .facilities-list li i {
     color: var(--color-primary);
 }

 .property-box-4 .read-more-btn {
     color: var(--color-primary);
 }

 .property-box-4 .read-more-btn:hover {
     background: var(--color-primary);
     color: #fff;
 }

 .property-box-2:hover .featured {
     color: #f40c43 !important;
 }

 .property-box-2:hover .listing-time {
     color: var(--color-primary);
 }

 .bootstrap-select .dropdown-menu li a:hover {
     background: var(--color-primary);
 }

 .bootstrap-select .dropdown-menu>.active>a,
 .bootstrap-select .dropdown-menu>.active>a:focus,
 .bootstrap-select .dropdown-menu>.active>a:hover {
     color: var(--color-primary);
 }

 .property-box .carousel-indicators .active {
     background-color: var(--color-primary);
 }

 .team-2:hover .team-details h5 a {
     color: var(--color-primary);
 }

 .blog-2 .detail h3 a:hover {
     color: var(--color-primary);
 }

 .testimonial-3 .testimonial-inner .content-box .testimonial-info:before {
     background: var(--color-primary);
 }

 .testimonial-3 .testimonial-inner .content-box .testimonial-info:after {
     background: var(--color-primary);
 }

 .testimonial-3 .testimonial-info:hover .rating span {
     color: var(--color-primary);
 }

 blockquote {
     border-left: 5px dashed var(--color-primary);
 }

 .listing-badges .featured {
     background-color: var(--color-primary);
 }

 .recent-properties-box .detail header::after {
     background-color: var(--color-primary);
 }

 .service-info-5::before {
     background-color: var(--color-primary);
 }

 .service-info-5 .service-i {
     color: var(--color-primary);
 }

 .slick-arrow-buton:hover {
     background: var(--color-primary);
 }

 .counters .counter-box i {
     color: var(--color-primary);
 }

 .slick-arrow-buton {
     color: var(--color-primary);
 }

 .our-newslatters-3 {
     background: var(--color-primary);
 }

 .counters .counter-box h1 {
     color: var(--color-primary);
 }

 .counters-2 .counter-box .icon {
     color: var(--color-primary);
 }

 .counters-3 .counter-box:hover {
     background: var(--color-primary);
 }

 .counters-3 .counter-box i {
     color: var(--color-secondary);
 }

 .counters-3 .counter-box h1 {
     color: var(--color-primary);
 }

 .counters-2 .counter-box h1 {
     color: var(--color-primary);
 }

 /* .btn-2 {
     background: var(--color-secondary);
 }

 .btn-2:hover {
     color: white;
     background-color: var(--color-primary) !important;
 }

 .btn-2:before {
     background: var(--color-primary);
 } */

 .btn-3:after {
     background: var(--color-primary);

 }

 .btn-2:after {
     background: var(--color-primary);

 }

 .btn-3 {
     color: var(--color-white);
     border: none;
     background: var(--color-secondary);

     border-radius: 5px;
 }

 .btn-4 {
     background: var(--color-primary);
 }

 .btn-1 {
     color: white;
     /* background-color: var(--color-primary); */
     /* border: 2px solid var(--color-primary); */
 }

 .btn-1:before {
     background: var(--color-secondary);
     /* border-color: var(--color-primary); */
 }

 .btn-1 span {
     color: white;
 }


 .plan2 .plan-header h5 {
     color: var(--color-primary);
 }

 .plan2 .plan-list ul li i {
     color: var(--color-primary);
 }

 .plan2 .plan-header .plan-price {
     color: var(--color-primary);
 }

 .listing-time {
     background: var(--color-primary);
 }

 .price-ratings-box .price {
     /* color: var(--color-secondary); */
 }

 .property-box .detail .title a {
     color: var(--color-primary);
 }

 .login-section .form-section input[type=checkbox]:checked+label:before {
     background: var(--color-primary);
     border: 1px solid var(--color-primary);
 }

 .blog-2 .photo .date-box {
     color: var(--color-primary);
 }

 footer .footer-item .contact-info li label a:hover {
     color: var(--color-primary);
 }

 .btn-white {
     color: var(--color-primary);
 }

 .btn-white:hover {
     color: #fff;
     background: var(--color-primary);
 }

 .service-box .heading .number h5 {
     color: var(--color-primary);
 }

 .service-box .heading .title h4 a:hover {
     color: var(--color-primary);
 }

 .plan .price-header h1 {
     color: var(--color-primary);
 }

 .btn-outline {
     border: solid 1px var(--color-primary);
     color: var(--color-primary);
 }

 .btn-outline:hover {
     border: solid 1px var(--color-primary);
     background: var(--color-primary);
     color: #fff;
 }

 .btn-outline-2 {
     border: solid 2px var(--color-primary);
     color: var(--color-primary);
     font-weight: 600;
 }

 .team-5 p i {
     color: var(--color-primary);
 }

 .heading-properties h3 span {
     color: var(--color-primary);
 }

 .heading-properties-2 h3 span {
     color: var(--color-primary);
 }

 .leaflet-container a.leaflet-popup-close-button {
     color: var(--color-primary);
 }

 .btn-outline-2:hover {
     border: solid 2px var(--color-primary);
     background: var(--color-primary);
     color: #fff;
 }

 .map-properties .map-properties-fetures span i {
     color: var(--color-primary);
 }

 .property-box-4 .info ul li i {
     color: var(--color-primary);
 }

 .property-box-4 .info h3 a:hover {
     color: var(--color-primary);
 }

 .testimonial-2 .carousel-indicators .active {
     background-color: var(--color-primary);
 }

 .property-box-5 .detail h3 a {
     color: var(--color-primary);
 }

 .about-box .detail h3 {
     color: var(--color-primary);
 }

 .property-box-5 .carousel-indicators .active {
     background: var(--color-primary);
 }

 li.active.btn.filtr-button.filtr {
     color: #f40c43 !important;
 }

 .banner .slider-mover-left:hover {
     background: var(--color-primary);
     color: #fff;
     border: solid 1px var(--color-primary);
 }

 .banner .slider-mover-right:hover {
     background: var(--color-primary);
     color: #fff;
     border: solid 1px var(--color-primary);
 }

 .filteriz-navigation li:hover {
     color: var(--color-primary);
 }

 .change-view-btn {
     color: var(--color-primary);
     border: solid 1px var(--color-primary);
 }

 .change-view-btn:hover {
     border: solid 1px var(--color-primary);
     background: var(--color-primary);
 }

 .sub-banner .page-info .breadcrumb-area ul li a:hover {
     color: var(--color-primary);
 }

 .active-view-btn {
     background: var(--color-primary);
     border: solid 1px var(--color-primary);
 }

 .active-view-btn:hover {
     border: solid 1px var(--color-primary);
     color: var(--color-primary);
 }

 .show-more-options,
 .show-more-options:hover {
     color: #f40c43 !important;
 }

 .form-content-box .footer span a {
     color: var(--color-primary);
 }

 .blog-1 .post-meta ul li a:hover {
     color: var(--color-primary);
 }

 .pagination>li>a:hover {
     background: #f40c43 !important;
     color: #fff;
 }

 .pagination>li>.active {
     background: var(--color-primary);
 }

 .read-more {
     color: var(--color-primary);
 }

 .partners .slick-arrow-buton:hover {
     color: #fff;
     background: var(--color-primary);
     opacity: 1;
 }

 .blog-1 .detail h3 a:hover {
     color: var(--color-primary);
 }

 .range-slider .ui-slider .ui-slider-handle {
     background: var(--color-primary);
 }

 .range-slider .ui-slider .ui-slider-handle {
     border: 2px solid var(--color-primary);
 }

 .range-slider .ui-widget-header {
     background-color: var(--color-primary);
 }

 .posts-by-category ul li a:hover {
     color: var(--color-primary);
 }

 .tags-box ul li a:hover {
     border: 1px solid var(--color-primary);
     background: var(--color-primary);
 }

 .latest-tweet a {
     color: var(--color-primary);
 }

 .slider-btn-l i {
     color: var(--color-primary);
 }

 .min-value {
     color: var(--color-primary);
 }

 .max-value {
     color: var(--color-primary);
 }

 .slider-btn-r i {
     color: var(--color-primary);
 }

 .comment-meta a {
     color: var(--color-primary);
 }

 .comment-meta a:hover {
     color: var(--color-primary);
 }

 .blog-tags a:hover {
     border: 1px solid var(--color-primary);
     background: var(--color-primary);
     color: #fff;
 }

 .about-text ul li i {
     color: var(--color-primary);
 }

 .breadcrumbs li a:hover {
     color: var(--color-primary);
 }

 .helping-center ul li i {
     color: var(--color-primary);
 }

 .my-account-box ul li a:hover {
     color: var(--color-primary);
 }

 .my-account-box ul li a.active {
     color: var(--color-primary);
 }

 .my-account-box .title::after {
     background-color: var(--color-primary);
 }

 .photoUpload {
     background: var(--color-primary);
 }

 .btn-6:before {
     background: var(--color-primary);
 }

 .typography-page mark.color {
     background-color: var(--color-primary);
 }

 .my-properties table tbody tr td a:hover {
     color: var(--color-primary);
 }

 .typography .list-3 li:before,
 .list-2 li:before,
 .list-1 li:before {
     color: var(--color-primary);
 }

 .numbered.color.filled ol>li::before {
     border: 1px solid var(--color-primary);
     background-color: var(--color-primary);
 }

 .numbered.color ol>li::before {
     border: 1px solid var(--color-primary);
     color: var(--color-primary);
 }

 .widget-link:hover {
     color: var(--color-primary);
 }

 .coming-soon-inner .btn,
 .coming-soon-inner .btn:hover,
 .coming-soon-inner .btn:active {
     background: var(--color-primary);
 }

 .property-box-2 .detail .title a {
     color: var(--color-primary);
 }

 .compare-properties .detail .title a {
     color: var(--color-primary);
 }

 .property-box-2 .footer ul li a:hover {
     color: var(--color-primary);
 }

 .tabbing-box .nav-tabs .nav-item.show .nav-link,
 .nav-tabs .nav-link.active {
     background-color: var(--color-primary);
 }

 .tabbing-box .nav-tabs .nav-item.show .nav-link,
 .nav-tabs .nav-link:hover {
     background-color: var(--color-primary);
 }

 .view-all ul li a:hover {
     background: var(--color-primary);
     color: #fff;
 }

 .map-marker:hover {
     background-color: var(--color-primary);
     cursor: pointer;
 }

 .map-marker:hover:before {
     border-color: #f40c43 transparent transparent transparent;
 }

 .map-marker.featured:hover {
     background-color: var(--color-primary);
 }

 .map-marker.featured:hover:before {
     border-color: #f40c43 transparent transparent transparent;
 }

 .map-marker .icon {
     border: 3px solid var(--color-primary);
 }

 .property-info .property-info-inner .for-sale {
     background: var(--color-primary);
 }

 .property-info .property-info-inner h2 span {
     color: var(--color-primary);
 }

 .marker-active .map-marker {
     background-color: var(--color-primary);
 }

 .get-in-touch .get-in-touch-box i:hover {
     color: #f40c43 !important;
 }

 .marker-active .map-marker:before {
     border-color: #f40c43 transparent transparent transparent;
 }

 .map-properties .address i {
     color: var(--color-primary);
 }

 .map-properties-btns .border-button-theme {
     color: #f40c43 !important;
 }

 .map-properties .map-content h4 a {
     color: var(--color-primary);
 }

 .dropzone-design:hover {
     border: 2px dashed var(--color-primary);
 }

 @media (max-width: 992px) {
     .ss2 {
         background: var(--color-primary);
     }
 }

 @media (max-width: 768px) {
     .navbar-default .navbar-toggle .icon-bar {
         background-color: var(--color-primary);
     }

     .navbar-default .navbar-nav>.active>a,
     .navbar-default .navbar-nav>.active>a:focus,
     .navbar-default .navbar-nav>.active>a:hover {
         background-color: #f40c43 !important;
     }

     .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,
     .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
         background-color: #f40c43 !important;
     }

     .navbar-default .navbar-nav .open .dropdown-menu>li>a {
         background: #eee;
     }
 }

 .main-title-4 h1 span {
     color: var(--color-primary);
 }

 .main-title-3 h1 span {
     color: var(--color-primary);
 }

 .navbar-light .navbar-toggler {
     background: var(--color-primary);
 }

 @keyframes pulse {

     0%,
     100% {
         background-color: var(--color-primary);
     }

     50% {
         background-color: var(--color-primary);
     }
 }

 /** Top header **/
 .top-header {
     background-color: var(--color-primary);
 }

 .top-header .top-social-media li a:hover {
     background: var(--color-primary);
 }

 #top-header-2::after {
     background: var(--color-primary);
 }

 .top-header-3 .top-header-inner .top-contact-item i {
     color: var(--color-primary);
 }

 .top-header-3 .top-header-inner .top-contact-item p {
     color: var(--color-primary);
 }

 /** Main header **/
 .main-header .dropdown-menu a:hover {
     color: var(--color-primary);
 }

 #main-header-1 .navbar-expand-lg .navbar-nav .active .nav-link {
     color: var(--color-primary);
     border-bottom: solid 3px var(--color-primary);
 }

 #main-header-1 .navbar-expand-lg .navbar-nav .nav-link:hover {
     color: var(--color-primary);
     border-bottom: solid 3px var(--color-primary);
 }

 #main-header-3 .navbar-expand-lg .active .nav-link {
     color: var(--color-primary);
 }

 #main-header-4 .header-right {
     background: var(--color-primary);
 }

 #main-header-4 .navbar-expand-lg .navbar-nav .nav-link:hover {
     color: #f40c43 !important;
     border-bottom: solid 3px var(--color-primary);
 }

 #main-header-4 .navbar-expand-lg .active .nav-link {
     color: #f40c43 !important;
     border-bottom: solid 3px var(--color-primary);
 }

 .main-header-5 .navbar-expand-lg .navbar-nav .h-icon {
     color: var(--color-primary);
 }

 .main-header-5 .navbar-expand-lg .navbar-nav .h-icon:hover {
     color: #f40c43 !important;
 }

 #main-header-6 {
     background: var(--color-primary);
 }

 #main-header-1 .btn-5:before {
     background: var(--color-primary);
 }

 #main-header-1 .btn-5:after {
     background: var(--color-primary);
 }

 #main-header-1 .btn-5 {
     border: 1px solid #f40c43 !important;
     color: #f40c43 !important;
 }

 /** Media **/
 @media (min-width: 180px) {
     .main-header-5.header-shrink {
         background: var(--color-primary) !important;
     }

     .main-header-5.header-shrink .header-inner {
         background: var(--color-primary) !important;
     }
 }

 @media (min-width: 992px) {
     .main-header .navbar-expand-lg .navbar-nav .nav-link:hover {
         color: var(--color-primary) !important;
     }

     #main-header-5.header-shrink .navbar-expand-lg .navbar-nav .h-icon {
         color: var(--color-primary);
     }

     #main-header-5 .navbar-expand-lg .navbar-nav .h-icon:hover {
         color: var(--color-primary) !important;
     }

     #main-header-6.header-shrink .navbar-expand-lg .navbar-nav .h-icon {
         color: var(--color-primary);
     }

     #main-header-6 .navbar-expand-lg .navbar-nav .h-icon:hover {
         color: var(--color-primary) !important;
     }
 }

 @media (max-width: 992px) {
     .main-header .navbar-expand-lg .navbar-nav .nav-link:hover {
         color: #f40c43 !important;
     }

     .main-header-5 {
         background: #f40c43 !important;
     }

     .main-header-5 .header-inner {
         background: #f40c43 !important;
     }

     #main-header-6 {
         background: var(--color-primary) !important;
     }
 }

 @media (max-width: 768px) {
     .navbar-default .navbar-toggle .icon-bar {
         background-color: var(--color-primary);
     }

     .navbar-default .navbar-nav>.active>a,
     .navbar-default .navbar-nav>.active>a:focus,
     .navbar-default .navbar-nav>.active>a:hover {
         background-color: #f40c43 !important;
     }

     .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,
     .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
         background-color: #f40c43 !important;
     }

     .navbar-default .navbar-nav .open .dropdown-menu>li>a {
         background: #eee;
     }

     .main-header .navbar-default .nav>li>a:hover {
         background: var(--color-primary);
     }

     .navbar-default .navbar-nav .open .dropdown-menu>li>a {
         background: #eee;
     }
 }

 @media all and (min-width: 992px) {
     .header-with-top2.sticky-header {
         background: var(--color-primary);
     }
 }

 .fa-map-marker:before {
     color: var(--color-secondary);
     /* margin-right: 4px; */
 }


 /* ////////////////////////////heading  and para.....////////////////////////////// */
 .main-title {
     position: relative;
     /* margin-bottom: 60px; */
     animation: mainFadeUp 1s cubic-bezier(.22, 1, .36, 1) forwards;
 }

 /* Subtitle */
 .main-title .subtitle {
     display: inline-flex;
     align-items: center;

     font-size: 18px;
     font-weight: 500;
     letter-spacing: 2px;
     /* text-transform: capitalize; */

     color: var(--color-secondary);



     position: relative;

     padding-left: 55px;

     font-family: 'Jost', sans-serif;

     opacity: 0;

     animation:
         subtitleReveal 1s ease forwards .2s,
         floatingText 4s ease-in-out infinite 2s;

     transition:
         transform .4s ease,
         color .4s ease,
         letter-spacing .4s ease;
 }

 /* Animated Line */
 .main-title .subtitle::before {
     content: "";

     position: absolute;

     left: 0;
     top: 50%;

     width: 40px;
     height: 2px;

     background: var(--color-heading);

     transform: translateY(-50%) scaleX(0);
     transform-origin: left;

     animation:
         lineReveal .8s ease forwards .6s,
         pulseLine 3s ease-in-out infinite 1.5s;

     transition:
         width .4s ease,
         background .4s ease;
 }



 /* Hover Effect */
 .main-title:hover .subtitle {
     transform: translateX(8px);

     letter-spacing: 3px;

     color: var(--color-heading);
 }

 .main-title:hover .subtitle::before {
     width: 55px;
     background: var(--color-primary);
 }

 .main-title:hover .reveal-text {
     transform: translateY(-6px);

     letter-spacing: 0px;

     color: var(--color-primary);
 }

 /* Glow Effect */
 .main-title::after {
     content: "";

     position: absolute;

     left: -30px;
     top: -20px;

     width: 140px;
     height: 140px;

     background: rgba(216, 138, 118, 0.14);

     filter: blur(70px);

     opacity: .5;

     animation: glowMove 6s ease-in-out infinite;

     z-index: -1;
 }

 /* Initial Fade */
 @keyframes mainFadeUp {
     from {
         opacity: 0;
         transform: translateY(40px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 /* Subtitle Reveal */
 @keyframes subtitleReveal {
     from {
         opacity: 0;
         transform: translateX(-25px);
     }

     to {
         opacity: 1;
         transform: translateX(0);
     }
 }

 /* Line Animation */
 @keyframes lineReveal {
     to {
         transform: translateY(-50%) scaleX(1);
     }
 }

 /* Heading Reveal */
 @keyframes revealText {
     from {
         opacity: 0;
         transform: translateY(40px);
         filter: blur(12px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
         filter: blur(0);
     }
 }

 /* Floating Subtitle */
 @keyframes floatingText {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-3px);
     }
 }

 /* Floating Heading */
 @keyframes floatHeading {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-4px);
     }
 }

 /* Pulse Line */
 @keyframes pulseLine {

     0%,
     100% {
         opacity: 1;
         width: 40px;
     }

     50% {
         opacity: .7;
         width: 52px;
     }
 }

 /* Glow Movement */
 @keyframes glowMove {

     0%,
     100% {
         transform: translate(0, 0);
     }

     50% {
         transform: translate(20px, -10px);
     }
 }

 /* Responsive */
 @media (max-width: 768px) {

     .main-title .reveal-text {
         font-size: 36px;
     }

     .main-title .subtitle {
         font-size: 13px;
         /* letter-spacing: 1.5px; */
     }
 }


 /* ///////////////////////submit button */
 .custom-send-btn {
     border: none !important;
 }

 .contact-btn {
     border: none !important;

     outline: none;

     box-shadow: none;

     padding: 14px 30px;

     border-radius: 12px;

     /* font-family: 'Jost', sans-serif; */

     font-size: 15px;
     font-weight: 500;

     display: inline-flex;
     align-items: center;
     gap: 10px;

     transition: all .4s ease;
 }

 .contact-btn:hover {
     transform: translateY(-3px);
 }



 /*  */
 /* =========================
   Testimonial Modern Style
========================= */

 .testimonial-modern {
     position: relative;
 }

 .testimonial-header h2 {
     color: var(--color-heading);
     font-size: 42px;
     font-weight: 700;
     margin-bottom: 0;
 }

 .testimonial-subtitle {
     color: var(--color-primary);
     font-weight: 600;
     font-size: 14px;
     letter-spacing: 1px;
     text-transform: uppercase;
 }

 /* Slider Layout */

 .testimonial-slider-wrapper {
     display: flex;
     align-items: center;
     gap: 25px;
 }

 .testimonial-slider {
     width: 100%;
     overflow: hidden;
 }

 .testimonial-cards {
     display: grid;
     grid-template-areas: "stack";
 }

 /* Card */

 .testimonial-card {
     grid-area: stack;
     transition: all .5s ease;
 }

 /* Review Box */

 .review-card {
     background: var(--color-primary) !important;
     color: #fff;
     padding: 40px;
     border-radius: 24px;
     position: relative;
     font-size: 16px;
     line-height: 32px;


     transition: all .5s ease;
 }

 /* Arrow */

 .review-card::before {
     content: "";
     position: absolute;
     width: 22px;
     height: 22px;
     background: var(--color-primary);
     bottom: -8px;
     left: 50%;
     transform: translateX(-50%) rotate(45deg);
 }

 /* Details */

 .details {
     /* margin-top: 35px; */
     display: flex;
     flex-direction: column;
     align-items: center;
     /* gap: 12px; */

     transition: all .5s ease;
 }

 /* .details img {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     object-fit: cover;
     border: 4px solid #fff;

     box-shadow:
         0 10px 30px rgba(0, 0, 0, 0.08);
 } */

 .details [review-name] {
     color: var(--color-heading);
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 2px;
     text-align: center;
 }

 .details [review-role] {
     color: var(--color-primary);
     font-size: 14px;
     font-weight: 600;
     text-align: center;
 }

 /* Navigation */

 .testimonial-nav {
     width: 50px;
     height: 41px;
     border: none;
     border-radius: 50%;
     background: var(--color-primary);
     color: #fff;
     font-size: 24px;

     display: flex;
     align-items: center;
     justify-content: center;

     transition: all .3s ease;

     box-shadow:
         0 10px 25px rgba(0, 0, 0, 0.08);
 }

 .testimonial-nav:hover {
     background: var(--color-heading);
     transform: translateY(-3px);
 }

 /* Animation Classes */

 .scale-0 {
     transform: scale(.85);
     opacity: 0;
 }

 .translate-hidden {
     transform: translateY(80px);
     opacity: 0;
 }

 .opacity-0 {
     opacity: 0;
 }

 /* Active States */

 .testimonial-card.active {
     opacity: 1;
 }

 .testimonial-card.active .review-card {
     transform: scale(1);
     opacity: 1;
 }

 .testimonial-card.active .details {
     transform: translateY(0);
     opacity: 1;
 }

 /* Responsive */

 @media (max-width: 767px) {

     .testimonial-slider-wrapper {
         gap: 10px;
     }

     .review-card {
         padding: 30px 20px;
         font-size: 15px;
         line-height: 28px;
     }

     .testimonial-header h2 {
         font-size: 30px;
     }

     .testimonial-nav {
         width: 45px;
         height: 45px;
     }
 }

 .card {
     position: relative;
     display: flex;
     flex-direction: column;
     min-width: 0;
     word-wrap: break-word;
     background-color: #fff;
     background-clip: border-box;
     border: none;
     border-radius: .25rem;
 }

 /* Rating */

 .review-rating {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 6px;

     margin-bottom: 20px;

     opacity: 0;
     transform: translateY(20px);

     transition: all .5s ease;
 }

 .review-rating i {
     color: var(--color-heading);
     font-size: 18px;

     text-shadow:
         0 2px 8px rgba(255, 215, 0, 0.25);
 }

 /* Active Animation */

 .testimonial-card.active .review-rating {
     opacity: 1;
     transform: translateY(0);
 }


 .testimonial-4 {

     overflow: hidden;
 }



 /* BASE CARD WRAPPER */
 .item.slide-box {
     width: 100%;
     display: inline-block;
     animation: fadeInUp 0.8s ease both;
 }

 /* CARD */
 .property-box {
     background: #ffffff;
     /* border-radius: 5px; */
     overflow: hidden;
     /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); */
     transition: all 0.4s ease;
     position: relative;
 }

 /* FLOAT + LIFT EFFECT */
 .property-box:hover {
     transform: translateY(-12px) scale(1.01);
     /* box-shadow: 0 25px 60px rgba(0,0,0,0.18); */
 }

 /* IMAGE SECTION */
 .property-thumbnail {
     position: relative;
     overflow: hidden;
 }

 /* IMAGE ZOOM */
 .property-overflow img {
     width: 100%;
     height: 250px;
     object-fit: cover;
     transition: transform 0.7s ease;
 }

 .property-box:hover .property-overflow img {
     transform: scale(1.15) rotate(1deg);
 }

 /* DARK OVERLAY */
 .property-thumbnail::after {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(to top,
             rgba(0, 0, 0, 0.55),
             rgba(0, 0, 0, 0.1),
             transparent);
     z-index: 1;
 }

 /* PRICE BADGE (GLASS EFFECT) */
 .price-ratings-box {
     position: absolute;
     top: 15px;
     left: 15px;
     z-index: 2;
     animation: slideIn 0.6s ease;
 }

 .price {
     width: auto;
     display: inline-block;

     background: var(--color-heading);
     backdrop-filter: blur(12px);
     -webkit-backdrop-filter: blur(12px) !important;

     color: #fff;
     padding: 8px 16px;
     border-radius: 999px;

     font-size: 13px;
     font-weight: 600;

     border: 1px solid rgba(255, 255, 255, 0.25);

     transition: all 0.3s ease;
 }

 .property-box:hover .price {
     transform: scale(1.05);
 }


 .title {
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 6px;
 }

 .title a {
     text-decoration: none;
     color: #1a1a1a;
     transition: 0.3s ease;
 }

 .title a:hover {
     color: #2563eb;
     letter-spacing: 0.3px;
 }

 /* LOCATION */
 .location {
     font-size: 13px;
     color: #666;
     /* display: flex; */
     align-items: center;
     gap: 6px;
 }

 .location i {
     color: #ef4444;
     /* animation: bounce 2s infinite; */
 }



 /* AGENT IMAGE */
 .agent img {
     width: 42px;
     height: 42px;
     border-radius: 50%;
     /* object-fit: cover; */
     /* border: 2px solid #fff; */
     /* box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); */
     /* animation: float 3s ease-in-out infinite; */
 }

 /* DATE */
 .days p {
     margin: 0;
     font-size: 12.5px;
     color: #555;
     display: flex;
     align-items: center;
     gap: 6px;
 }

 /* ===================== */
 /* 🎬 ANIMATIONS */
 /* ===================== */

 @keyframes fadeInUp {
     from {
         opacity: 0;
         transform: translateY(40px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 @keyframes slideIn {
     from {
         opacity: 0;
         transform: translateX(-20px);
     }

     to {
         opacity: 1;
         transform: translateX(0);
     }
 }

 @keyframes float {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-6px);
     }
 }

 @keyframes bounce {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-3px);
     }
 }


 /* .p-4 {
     padding: 3.5rem !important;
 } */


 /* slider */
 .item-bg img {
     animation: zoomSlow 12s ease-in-out infinite alternate;
 }

 .carousel-item h3 {
     animation: fadeUp 1s ease forwards;
     opacity: 0;
     transform: translateY(30px);
 }

 .carousel-item p {
     animation: fadeUp 1s ease forwards;
     animation-delay: 0.2s;
     opacity: 0;
     transform: translateY(30px);
 }

 .btn-1,
 .btn-2 {
     opacity: 0;
     filter: blur(10px);
     transform: scale(0.95) rotate(-1deg);
     animation: premiumReveal 0.9s cubic-bezier(0.25, 1, 0.5, 1) forwards;
     animation-delay: 0.4s;
 }

 @keyframes premiumReveal {
     0% {
         opacity: 0;
         filter: blur(12px);
         transform: scale(0.95) rotate(-1deg);
     }

     100% {
         opacity: 1;
         filter: blur(0);
         transform: scale(1) rotate(0deg);
     }
 }



 /* Property Card */
 .property-box {
     background: #fff;
     /* border-radius: 12px; */
     overflow: hidden;
     transition: 0.4s ease;
     /* box-shadow: 0 5px 18px rgba(0, 0, 0, 0.08); */
     margin-bottom: 30px;
 }

 .property-box:hover {
     transform: translateY(-6px);
     /* box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); */
 }

 /* Property Image */
 .property-thumbnail {
     position: relative;
     overflow: hidden;
 }

 .property-thumbnail img {
     height: 260px;
     object-fit: cover;
     transition: 0.5s;
 }

 .property-box:hover .property-thumbnail img {
     transform: scale(1.05);
 }

 /* Price */
 .price-ratings-box {
     position: absolute;
     top: 15px;
     left: 15px;
     z-index: 9;
     max-height: 1px;
 }

 .price {
     background: #cc553d;
     color: #fff;
     padding: 8px 16px;
     border-radius: 30px;
     font-size: 15px;
     font-weight: 600;
     margin: 0;
 }



 /* Title */
 .title {
     font-size: 22px;
     line-height: 1.4;
     margin-bottom: 12px;
     font-weight: 700;
 }

 .title a {
     color: #222;
     text-decoration: none;
     transition: 0.3s;
 }

 .title a:hover {
     color: #c59d5f;
 }

 /* Location */
 .location a {
     display: flex;
     align-items: flex-start;
     gap: 8px;
     color: #666;
     text-decoration: none;
     line-height: 1.8;
     font-size: 15px;
 }

 .location i {
     color: #c59d5f;
     margin-top: 5px;
 }

 /* Two line text */
 .location-text {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     transition: 0.3s;
 }

 /* Expanded text */
 .location-text.expanded {
     -webkit-line-clamp: unset;
     overflow: visible;
 }

 /* Read More Button */
 .read-more-btn {
     border: none;
     background: transparent;
     color: #c59d5f;
     font-size: 14px;
     font-weight: 600;
     padding: 0;
     margin-top: 5px;
     margin-left: 28px;
     cursor: pointer;
     transition: 0.3s;
 }

 .read-more-btn:hover {
     color: #000;
 }

 /* Footer */
 .footer {
     border-top: 1px solid #eee;
     padding: 15px 22px;
 }

 .agent .user img {
     width: 45px;
     height: 45px;
     object-fit: contain;
     border-radius: 50%;
     /* border: 1px solid #eee; */
     padding: 5px;
     /* background: #fff; */
 }




 .location-text {
     display: -webkit-box;
     -webkit-line-clamp: 2;
     /* show 2 lines */
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
     transition: all 0.3s ease;
 }

 .location-text.expanded {
     -webkit-line-clamp: unset;
     overflow: visible;
 }

 .read-more-btn {
     background: none;
     border: none;
     color: #007bff;
     cursor: pointer;
     font-size: 14px;
     font-weight: 600;
     margin-top: 5px;
     padding: 0;
     display: inline-block;
 }

 .read-more-btn:hover {
     text-decoration: underline;
 }




 .location a {
     display: flex;
     align-items: flex-start;
     gap: 8px;
     color: #666;
     text-decoration: none;
     line-height: 1.8;
     font-size: 15px;
 }

 .location i {
     color: #c59d5f;
     margin-top: 5px;
 }

 .read-badge {
     display: inline-block;
     margin-top: 12px;
     padding: 7px 16px;
     border-radius: 30px;
     background: #f7f7f7;
     border: 1px solid #e5e5e5;
     color: #222;
     font-size: 13px;
     font-weight: 600;
     cursor: pointer;
     transition: 0.3s ease;
 }

 .read-badge:hover {
     background: #c59d5f;
     border-color: #c59d5f;
     color: #fff;
 }

 .btn-3 {
     color: var(--color-white);
     border: none;
     background: var(--color-secondary);
     border-radius: 5px;

     transition: all 0.35s ease;
     position: relative;
     overflow: hidden;
 }

 .btn-3:hover {
     transform: translateY(-4px) scale(1.02);
     /* box-shadow: 0 14px 28px rgba(0, 0, 0, 0.15); */
 }

 .btn-3::before {
     content: '';
     position: absolute;
     top: 0;
     left: -120%;
     width: 100%;
     height: 100%;
     background: rgba(255, 255, 255, 0.18);
     transform: skewX(-25deg);
     transition: 0.7s;
 }

 .btn-3:hover::before {
     left: 120%;
 }

 @keyframes floatBtn {
     0% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-8px);
     }

     100% {
         transform: translateY(0px);
     }
 }


 .main-title .reveal-text {
     font-size: 42px;
     font-weight: 600;
     /* line-height: 60px; */
     color: var(--color-heading);
     letter-spacing: -1px;
     max-width: 700px;
     margin: 0;
     opacity: 1;
     transform: none;
     transition: transform 0.5s ease,
         letter-spacing 0.5s ease,
         color 0.5s ease;
 }

 /* Reveal animation (you already have this assumed) */
 @keyframes revealText {
     to {
         opacity: 1;
         transform: translateY(0px);
     }
 }

 /* Up-down floating */
 @keyframes floatHeading {

     0%,
     100% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-10px);
     }
 }

 /* ✔ NEW LEFT ↔ RIGHT movement */
 @keyframes moveSideHeading {
     0% {
         transform: translateX(0px);
     }

     25% {
         transform: translateX(-8px);
     }

     50% {
         transform: translateX(0px);
     }

     75% {
         transform: translateX(8px);
     }

     100% {
         transform: translateX(0px);
     }
 }


 /* Hide default cursor */
 body {
     cursor: auto;
 }

 /* DOT cursor */
 .cursor-dot {
     width: 8px;
     height: 8px;
     background: linear-gradient(135deg, #ff6a00, #ff2e63);
     border-radius: 50%;
     position: fixed;
     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 9999;
     transform: translate(-50%, -50%);
 }

 /* OUTER RING (hidden by default) */
 .cursor-ring {
     width: 40px;
     height: 40px;
     /* border: 2px solid #000; */
     border-radius: 50%;
     position: fixed;
     background-color: #03060e61;

     top: 0;
     left: 0;
     pointer-events: none;
     z-index: 9998;

     transform: translate(-50%, -50%) scale(0);
     opacity: 0;

     transition: transform 0.2s ease, opacity 0.2s ease;
 }

 /* SHOW ONLY ON HOVER */
 .cursor-ring.active {
     transform: translate(-50%, -50%) scale(1);
     opacity: 1;
 }

 /* CLICK EFFECT */
 .cursor-click {
     transform: translate(-50%, -50%) scale(0.75);
 }

 /* ////////////footer section css/////////////////////////*/

 /* 
 .footer-1 {
    background: #0f172a;
    padding: 80px 0 40px;
    color: #cbd5e1;
} */

 .footer-logo img {
     max-width: 200px;
 }

 /* Footer Titles */
 .footer-item h4 {
     color: #fff;
     font-size: 22px;
     font-weight: 700;
     /* margin-bottom: 24px; */
 }

 /* Lists */
 .contact-info,
 .links,
 .footer-points,
 .social-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .contact-info li,
 .links li {
     /* margin-bottom: 14px; */
     line-height: 1.8;
 }

 /* Links */
 .contact-info a,
 .links a {
     color: #cbd5e1;
     text-decoration: none;
     transition: all 0.3s ease;
 }

 .contact-info a:hover,
 .links a:hover {
     color: #fff;
     padding-left: 4px;
 }

 /* WhatsApp Section */
 .footer-connect {
     padding-left: 30px;
 }

 .footer-text {
     color: #cbd5e1;
     line-height: 1.8;
     margin-bottom: 24px;
     max-width: 500px;
 }

 /* WhatsApp Button */
 .footer-whatsapp-main {
     display: inline-flex;
     align-items: center;
     gap: 12px;

     background: #25d366;
     color: #fff;

     padding: 14px 22px;

     border-radius: 14px;

     text-decoration: none;
     font-weight: 600;

     transition: all 0.3s ease;
 }

 .footer-whatsapp-main:hover {
     background: #1ebe5d;
     color: #fff;
     transform: translateY(-2px);
 }

 .footer-whatsapp-main i {
     font-size: 20px;
 }

 /* Divider */
 .footer-divider {
     width: 100%;
     height: 1px;

     background: rgba(255, 255, 255, 0.1);

     margin: 20px 0;
 }

 /* Points */
 .footer-points {
     display: grid;
     gap: 14px;
 }

 .footer-points li {
     display: flex;
     align-items: center;
     gap: 10px;

     color: #e2e8f0;
     font-size: 15px;
 }

 .footer-points i {
     color: #22c55e;
     font-size: 16px;
 }

 /* Social */
 .social-list {
     display: flex;
     align-items: center;
     gap: 14px;

     margin-top: 30px;
 }

 .social-list a {
     width: 42px;
     height: 42px;

     display: flex;
     align-items: center;
     justify-content: center;

     border-radius: 50%;

     background: rgba(255, 255, 255, 0.08);
     color: #fff;

     transition: all 0.3s ease;
 }

 .social-list a:hover {
     transform: translateY(-3px);
     background: #25d366;
 }

 /* Responsive */
 @media (max-width: 992px) {

     .footer-connect {
         padding-left: 0;
     }

     .footer-1 {
         padding: 60px 0 30px;
     }

 }

 @media (max-width: 576px) {

     .footer-item h4 {
         font-size: 20px;
     }

     .footer-logo img {
         max-width: 150px;
     }

     .footer-whatsapp-main {
         width: 100%;
         justify-content: center;
     }

 }

 .top-logo {
     padding: 12px 16px;
 }

 .top-logo img {
     max-height: 70px;
     width: auto;
 }

 .navbar-collapse {
     padding: 0 10px;
 }


 /* //////////////////////////////////detail image///////////////////////////////////////////// */
 /* Review User Section */
 .details {
     display: flex;
     align-items: center;
     gap: 14px;
 }

 /* Review Image */
 .details img[review-img] {
     width: 64px;
     height: 64px;

     object-fit: cover;

     border-radius: 50%;


     box-shadow:
         0 8px 20px rgba(15, 23, 42, 0.12);

     flex-shrink: 0;

     background: #f8fafc;
 }

 /* Optional Hover Effect */
 .details img[review-img]:hover {
     transform: scale(1.05);

     transition: all 0.3s ease;
 }

 /* Name */
 .details p[review-name] {
     margin: 0;

     font-size: 16px;
     font-weight: 700;

     color: #0f172a;
 }

 /* Role */
 .details p[review-role] {
     margin: 4px 0 0;

     font-size: 14px;

     color: #64748b;
 }

 /* /////////////////////////////// contact and home page form/////////////////////////////////////// */


 /* Form Area */
 #contact_form {
     position: relative;
 }


 /* Inputs + Select + Textarea */
 #contact_form .form-control {
     width: 100%;
     height: 42px;

     border: 1px solid #dbe4ee;

     border-radius: 6px;

     background: #fff;

     padding: 0 20px;

     font-size: 15px;
     font-weight: 500;

     color: #9aa8bc;

     box-shadow: none;

     transition: all 0.3s ease;
     margin-bottom: 4px;
 }

 /* Textarea */
 #contact_form textarea.form-control {
     height: 125px;

     padding: 18px 20px;

     resize: none;
 }

 /* Select */
 #contact_form select.form-control {
     cursor: pointer;

     appearance: none;

     background-image:
         url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 5.646a.5.5 0 0 1 .708 0L8 11.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");

     background-repeat: no-repeat;

     background-position: right 18px center;

     background-size: 18px;
 }

 /* Placeholder */
 #contact_form .form-control::placeholder {
     color: #94a3b8;
 }



 /* Buttons Area */
 .send-btn {
     display: flex;
     align-items: center;
     gap: 16px;

     margin-top: 10px;

     flex-wrap: wrap;
 }


 /* Responsive */
 @media (max-width: 768px) {

     #contact_form .form-control {
         /* height: 54px;

         border-radius: 14px; */
     }

     #contact_form textarea.form-control {
         height: 120px;
     }

     .send-btn {
         flex-direction: column;
         align-items: stretch;
     }

     .btn-3 {
         width: 100%;
     }

 }








 .btn-2 {
     color: var(--color-white);
     border: none;
     background-color: green;
     border-radius: 5px;

     transition: all 0.35s ease;
     position: relative;
     overflow: hidden;
 }

 .btn-2:hover {
     transform: translateY(-4px) scale(1.02);
     color: white;
     background-color: var(--color-secondary) !important;
 }

 .btn-2::before {
     content: '';
     position: absolute;
     top: 0;
     left: -120%;
     width: 100%;
     height: 100%;
     background: rgba(255, 255, 255, 0.18);
     transform: skewX(-25deg);
     transition: 0.7s;
 }

 .btn-2:hover::before {
     left: 120%;
 }

 @keyframes floatBtn {
     0% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-8px);
     }

     100% {
         transform: translateY(0px);
     }
 }



 .testimonial_box {
     display: flex;
     max-width: 100%;
     height: 420px;
     overflow: hidden;
     border-radius: 10px;
 }

 /* Base card */
 .testimonial {
     flex: 1;
     min-width: 80px;
     position: relative;
     /* background: #a0acb0; */
     overflow: hidden;
     cursor: pointer;
     transition: all 0.5s ease-in-out;
 }

 /* Expanded state */
 .testimonial.expanded {
     flex: 5;
     /* background: #dce5f0; */
 }

 /* Content hidden by default */
 .testim_content {
     position: relative;
     padding-top: 108px;
     max-width: 79%;
     transform: translateX(120%);
     transition: all 0.5s ease-in-out;
 }

 /* Show content on expand */
 .testimonial.expanded .testim_content {
     transform: translateX(0);
 }

 /* Image styling */
 .testimonial img {
     position: absolute;
     bottom: 0;
     right: -30px;
     height: 80%;
     filter: grayscale(1);
     transition: all 0.4s ease-in-out;
 }

 /* Active image */
 .testimonial.expanded img {
     filter: none;
     right: 0;
 }

 /* Text styles */
 .highlight,
 .name {
     font-size: 22px;
     position: relative;
     color: var(--color-primary);
 }



 /* .name:before {
    content: '';
    position: absolute;
    left: 0;
    width: 5px;
    height: 100%;
    background: #1d9fd9;
    transform: skew(-15deg);
} */



 .rating {
     color: var(--color-secondary);
     font-size: 18px;
 }

 .rating i {
     margin: 0 2px;
 }

 .highlight {
     font-size: 22px;
     font-weight: 600;
     margin-bottom: 15px;
 }

 .name {
     font-weight: 700;
     /* margin-top: 15px; */
 }

 .company {
     color: #777;
     font-size: 14px;
 }

 /* .w-100{
    width: auto !important;
} */

 .item-bg {
     height: 510px;
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     position: relative;
 }

 .carousel-caption {
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     display: flex;
     align-items: center;
 }

 /* .contact-form{
background:#fff;
padding:40px;
border-radius:15px;
box-shadow:0 10px 35px rgba(0,0,0,0.08);
} */

 .contact-form .form-group {
     margin-bottom: 20px;
 }

 .contact-form .form-control {
     height: 55px;
     border: 1px solid #e5e7eb;
     border-radius: 10px;
     padding: 12px 18px;
     font-size: 15px;
     transition: all .3s ease;
     box-shadow: none;
 }

 .contact-form textarea.form-control {
     height: 140px;
     resize: none;
     padding-top: 15px;
 }

 .contact-form .form-control:focus {
     border-color: #c79a3b;
     box-shadow: 0 0 0 4px rgba(199, 154, 59, .15);
 }

 .contact-form .form-title {
     font-size: 28px;
     font-weight: 700;
     color: var(--color-primary);
     margin-bottom: 10px;
 }

 .contact-form .form-subtitle {
     color: #6b7280;
     margin-bottom: 30px;
 }

 .submit-btn {
     width: 100%;
     height: 55px;
     border: none;
     /* border-radius:10px; */
     background: var(--color-secondary);
     color: #fff;
     font-size: 16px;
     font-weight: 600;
     transition: .3s;
 }

 .submit-btn:hover {
     background: #b88a2f;
     transform: translateY(-2px);
 }

 /* =========================
   MOBILE RESPONSIVE CSS
========================= */
 @media (max-width: 768px) {

     /* Global spacing fix */
     .fw-bold {
         font-weight: 800 !important;
         margin-top: 25px;
     }

     /* Remove forced left margins */
     /* .row,
     .container {
         margin-left: 0 !important;
     } */

     /* Header section */
     h1 {
         width: 100% !important;
         font-size: 22px !important;
         margin-top: 0 !important;
     }

     /* Text content */
     p {
         font-size: 14px;
         line-height: 1.6;
     }

     /* Stack columns */
     .row.align-items-center,
     .row.vision-section {
         flex-direction: column !important;
     }

     /* Image adjustments */
     .profile-image-card img,
     .vision-image,
     .image-wrap img {
         width: 100% !important;
         height: auto !important;
     }

     /* Feature boxes full width */
     .feature-box,
     .service-box {
         width: 100%;
         margin-bottom: 15px;
     }

     /* Vision section fix */
     .vision-content {
         padding: 20px !important;
         height: auto !important;
     }

     /* Remove negative margins */
     .image-wrap {
         margin-left: 0 !important;
     }

     /* Service boxes stack */
     .col-md-4 {
         width: 100% !important;
     }

     /* Counters stack */
     .counter-box {
         margin-bottom: 20px;
     }

     /* Hide desktop/mobile swap issues */
     /* #mobile_hide,
     #desktop_hide {
         display: block !important;
     } */

     /* Better spacing for headings */
     h2,
     h3 {
         font-size: 20px;
         /* margin: 20px; */
     }


 }

 @media (max-width: 992px) {
     #main-header-6 {
         background: var(--color-primary) !important;
         margin-top: -99px;
     }

     .footer-1 .footer-item {
         margin-bottom: 1px !important;
         /* text-align: left; */
     }

     .col-xl-2 {
         margin-top: 10px !important;
     }

     /* 
.counter-box.detail{
    padding: 0px !important;
} */
 }



 .customer-image img {
     width: 100%;
     max-width: 160px;
     /* controls size */
     height: auto;
     display: block;
     object-fit: contain;
 }

 /* .counters-3 {
    padding: 100px 0;
    background: url(../images/home-growth-section.jpeg);
    z-index: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
} */
 .form-label {
     font-size: 14px;
     font-weight: 600;
     margin-bottom: 6px;
     color: #333;
 }

 .form-control::placeholder,
 textarea::placeholder {
     color: #999;
     font-size: 14px;
 }

 .form-label::after {
     color: red;
 }

 .footer-1 .footer-inner .contact-info {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .footer-1 .footer-inner .contact-info li {
     font-size: 15px;
     color: var(--color-secondary-text-color);
     . font-weight: 400;
     padding-bottom: 4px;
     margin-bottom: 5px;
 }

 .about-heading {
     max-width: 509px;
     margin: 0;
     line-height: 1.2;
 }

 .about-content {
     margin: 0;
 }

 .work-section {
     margin: 0 35px 30px;
     align-items: flex-start;
 }

 .work-title {
     color: var(--color-secondary);
     /* margin-bottom:20px; */
     font-weight: 700;
 }



 .service-box {
     height: 100%;
 }

 .service-box h6 {
     font-weight: 600;
     margin-top: 15px;
 }

 .banner-subtitle {
     display: inline-flex;
     align-items: center;
     position: relative;
     padding-left: 55px;
     color: #fff;
     font-size: 18px;
     font-weight: 500;
     letter-spacing: 2px;
     opacity: 0;
     animation:
         subtitleReveal 1s ease forwards .2s,
         floatingText 4s ease-in-out infinite 2s;
 }

 .banner-subtitle::before {
     content: "";
     position: absolute;
     left: 0;
     top: 50%;
     width: 40px;
     height: 2px;
     background: #fff;
     transform: translateY(-50%) scaleX(0);
     transform-origin: left;
     animation:
         lineReveal .8s ease forwards .6s,
         pulseLine 3s ease-in-out infinite 1.5s;
 }

 @keyframes subtitleReveal {
     from {
         opacity: 0;
         transform: translateY(20px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 @keyframes lineReveal {
     from {
         transform: translateY(-50%) scaleX(0);
     }

     to {
         transform: translateY(-50%) scaleX(1);
     }
 }

 @keyframes floatingText {

     0%,
     100% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-3px);
     }
 }

 @keyframes pulseLine {

     0%,
     100% {
         width: 40px;
     }

     50% {
         width: 55px;
     }
 }



 .vision-content {
     background: #0c2d57;

     color: #fff;
 }

 .image-wrap img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
 }

 .vision-section {
     overflow: hidden;
     /* border-radius: 10px; */
     /* width: ; */
     margin: 36px;
 }

 .track-record-title {
     font-size: 45px;
     line-height: 50px;
     transition: color 0.3s ease;
     cursor: pointer;
 }

 .youtube-bg {
     background: #ff0000;
     color: #fff !important;
     display: inline-flex;
     align-items: center;
     justify-content: center;
 }

 .youtube-bg i {
     color: #fff !important;
 }

 @media (max-width: 767px) {
     .counter-box .detail {
         padding: 0 !important;
     }
 }

 @media (max-width: 767px) {
     .contact-banner .container {
         position: relative;
     }

     .contact-banner .banner-content {
         position: absolute !important;
         left: -5px !important;
         top: 90px !important;
         transform: translateY(-50%) !important;
         margin: 0 !important;
         max-width: calc(100% - 30px) !important;
         text-align: left !important;
         background: #0009;
         padding: 8px;
         border-radius: 4px;
     }
 }