/* GLOBAL */
html, body {
height: 100%;
}

body {
display: flex;
flex-direction: column;
}

.main-wrapper {
flex: 1;
}
body{
font-family:'Poppins',sans-serif;
background:#f5f7fb;
margin:0;
color:#333;
line-height:1.6;
}

/* HERO SECTION */

.hero-section{
position:relative;
height:550px;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
}

/* Ã°Å¸Å½Â¥ VIDEO */
.hero-video{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
z-index:1;
}

/* DARK OVERLAY */
.hero-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(to right,rgba(0,0,0,0.75),rgba(0,0,0,0.3));
z-index:2;
}

/* CONTENT ABOVE VIDEO */
.hero-overlay{
position:relative;
z-index:3;
text-align:center;
}

.hero-title{
font-size:52px;
font-weight:700;
margin-bottom:10px;
}

.hero-subtitle{
font-size:20px;
margin-bottom:30px;
color:#eee;
}

/* SEARCH BOX */

.search-box{
background:white;
padding:25px;
border-radius:12px;
box-shadow:0 20px 50px rgba(0,0,0,0.25);
max-width:900px;
margin:auto;
}

.search-input{
height:50px;
border-radius:8px;
border:1px solid #ddd;
}

.search-btn{
height:50px;
font-weight:600;
}

/* SECTION TITLE */



/* CATEGORY CARDS */

.category-card{
background:white;
padding:40px 25px;
border-radius:14px;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
text-align:center;
transition:all 0.3s ease;
cursor:pointer;
}

.category-card:hover{
transform:translateY(-8px);
box-shadow:0 20px 45px rgba(0,0,0,0.15);
}

.category-icon{
font-size:40px;
margin-bottom:10px;
}

/* PROPERTY CARD */

.property-card:hover{
transform:translateY(-6px);
box-shadow:0 18px 40px rgba(0,0,0,0.15);
}

/* PROPERTY IMAGE */



.property-img img{
width:100%;
height:230px;
object-fit:cover;
transition:0.4s;
}

.property-card:hover img{
transform:scale(1.08);
}

/* PRICE TAG */

.price-tag{
    position:absolute;
    background:#0d6efd;
    color:#fff;
    padding:5px 10px;
    border-radius:20px;
    font-size:12px;
    font-weight:bold;
    transform:translate(-50%, -100%);
    cursor:pointer;
    white-space:nowrap;
    box-shadow:0 2px 6px rgba(0,0,0,0.3);
}

/* FEATURED BADGE */

.featured-badge{
position:absolute;
top:10px;
left:10px;
background:#ff5a5f;
color:white;
padding:5px 10px;
font-size:12px;
border-radius:5px;
}

/* PROPERTY INFO */



.location{
color:#777;
font-size:14px;
margin-bottom:8px;
}

.property-features{
display:flex;
justify-content:space-between;
margin:12px 0;
color:#555;
font-size:14px;
}

.views{
font-size:13px;
color:#999;
margin-bottom:10px;
}

/* LOCATION CARDS */

/* LOCATION CARDS */

/* LOCATION SECTION PADDING */

/* LOCATION SECTION */

/* LOCATION SECTION */

/* LOCATION SECTION */

.location-section{
padding:50px 0;
}

/* SWIPER WRAPPER SPACING */

.locationSlider{
padding:10px 30px;
}

/* EACH SLIDE */

.swiper-slide{
width:auto !important;
}

/* CARD */

.location-card{
position:relative;
width:220px;
height:140px;
border-radius:10px;
overflow:hidden;
box-shadow:0 4px 12px rgba(0,0,0,0.15);
margin:0 10px;
}

/* IMAGE */

.location-card img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* TEXT */

.location-overlay{
position:absolute;
bottom:0;
left:0;
width:100%;
padding:5px 8px;
background:linear-gradient(to top,rgba(0,0,0,0.7),transparent);
color:#fff;
font-size:13px;
font-weight:600;
}
/* WHY CHOOSE US */



/* CTA PROPERTY BANNER */

/* CTA PROPERTY BANNER */

.cta-property{

background:
linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),
url('../images/noida.png') center/cover no-repeat;

padding:80px 0;
margin:70px 0;
border-radius:12px;
color:white;

}

.cta-title{
font-size:36px;
font-weight:700;
margin-bottom:10px;
}

.cta-text{
font-size:17px;
opacity:0.9;
}

/* BUTTON GROUP */

.cta-buttons{
display:flex;
gap:15px;
justify-content:flex-end;
flex-wrap:wrap;
}

.cta-buttons .btn{
padding:12px 26px;
border-radius:8px;
font-weight:600;
}


.why-card{
background:white;
padding:30px;
border-radius:12px;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
transition:0.3s;
}

.why-card:hover{
transform:translateY(-5px);
box-shadow:0 18px 40px rgba(0,0,0,0.12);
}

/* STATS SECTION */

.stats-section{
background:#0d6efd;
color:white;
padding:60px 0;
margin-top:60px;
}

.stats-section h2{
font-size:36px;
font-weight:700;
}

.swiper-button-next,
.swiper-button-prev{
color:#000;
}

.city-card{
position:relative;
height:220px;
border-radius:12px;
overflow:hidden;
box-shadow:0 8px 20px rgba(0,0,0,0.15);
}

.city-card img{
width:100%;
height:100%;
object-fit:cover;
}

.city-card h4{
position:absolute;
bottom:10px;
left:15px;
color:white;
font-weight:700;
}

.agent-card{
background:white;
padding:30px;
border-radius:12px;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.agent-img{
width:80px;
height:80px;
border-radius:50%;
object-fit:cover;
margin-bottom:10px;
}



/* ================= PREMIUM BLOG TYPOGRAPHY ================= */

/* ================= ULTRA PREMIUM BLOG FONT ================= */
.blog-img{
    width: 100%;
    height: 200px;
    object-fit: contain; /* ðŸ”¥ show full image */
    background: #f5f5f5;
}
.blog-content {
    font-family: 'Source Serif 4', serif;
    font-size: 19px;
    line-height: 2;
    color: #1a1a1a;
    letter-spacing: 0.2px;
}

/* HEADINGS */
.blog-content h1,
.blog-content h2,
.blog-content h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    color: #0f172a;
    margin-top: 35px;
    margin-bottom: 15px;
    line-height: 1.4;
}

.blog-content h1 {
    font-size: 34px;
}

.blog-content h2 {
    font-size: 28px;
    border-left: 5px solid #2563eb;
    padding-left: 12px;
}

.blog-content h3 {
    font-size: 22px;
}

/* PARAGRAPH */
.blog-content p {
    margin-bottom: 20px;
}

/* LINKS */
.blog-content a {
    color: #2563eb;
    font-weight: 500;
}

.blog-content a:hover {
    text-decoration: underline;
}

/* IMAGE */
.blog-content img {
    width: 100%;
    border-radius: 14px;
    margin: 30px 0;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

/* BLOCKQUOTE */
.blog-content blockquote {
    border-left: 5px solid #2563eb;
    padding-left: 18px;
    font-style: italic;
    color: #444;
    margin: 25px 0;
}

/* TABLE */
.blog-content table {
    width: 100%;
    margin: 25px 0;
    border-collapse: collapse;
}

.blog-content td, .blog-content th {
    border: 1px solid #ddd;
    padding: 12px;
}

/* BLOG CARD TEXT IMPROVEMENT */

.blog-title{
    font-size: 18px;
    font-weight: 700; /* ðŸ”¥ bold */
    margin-bottom: 8px;
    color: #111;
}

.blog-desc{
    font-size: 14px; /* ðŸ”½ smaller */
    color: #666;     /* lighter text */
    line-height: 1.5;
}

.blogSlider {
    padding: 20px 10px;
}

.blog-img {
    height: 200px;
    object-fit: cover;
}

/* Title Bold */
.blog-title {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 8px;
}

/* Small Description */
.blog-desc {
    font-size: 14px;
    color: #666;
}

/* Fix slide width */
.swiper-slide {
    width: auto !important;
}

/* ================= BLOG SLIDER PREMIUM ================= */

.blog-section{
    position: relative;
}

/* SLIDER */
.blogSlider {
    padding: 20px 0;
}

/* FIX CARD WIDTH */
.blogSlider .swiper-slide{
    width: 300px !important;
}

/* ðŸ”¥ ARROWS DESIGN */
.blog-arrows{
    position: absolute;
    top: 50%;
    width: 100%;
    z-index: 10;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

/* BUTTON STYLE */
.blog-prev,
.blog-next{
    pointer-events: all;
    background: #fff;
    border: none;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
}

/* ICON */
.blog-prev i,
.blog-next i{
    font-size: 20px;
    color: #111;
}

/* HOVER EFFECT */
.blog-prev:hover,
.blog-next:hover{
    background: #0d6efd;
}

.blog-prev:hover i,
.blog-next:hover i{
    color: #fff;
}

/* POSITION LEFT/RIGHT */
.blog-prev{
    margin-left: -20px;
}

.blog-next{
    margin-right: -20px;
}



/* IMAGE OVERLAY */
.img-overlay{
    position:absolute;
    bottom:0;
    width:100%;
    height:100%;
    background:linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}

/* TOP BADGE */
.top-bar{
    position:absolute;
    top:10px;
    left:10px;
    z-index:5;
}

/* PRICE OVERLAY */
.price-overlay{
    position:absolute;
    bottom:10px;
    left:10px;
    color:#fff;
    font-weight:700;
    font-size:18px;
    z-index:5;
}


.property-card:hover{
    transform:translateY(-5px);
}



.property-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* 🔥 FLEX CONTENT */

/* 🔥 PUSH BUTTON DOWN */
.property-info .btn{
    margin-top:auto;
}
/* CHATBOT */
#bharatacre-chatbot{
position:fixed;
bottom:80px;
right:20px;
width:300px;
background:white;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.2);
display:none;
overflow:hidden;
}

.chat-header{
background:#2563eb;
color:white;
padding:10px;
font-weight:bold;
}

#chat-messages{
height:200px;
overflow-y:auto;
padding:10px;
font-size:14px;
}

.chat-input{
display:flex;
}

.chat-input input{
flex:1;
border:none;
padding:10px;
}

.chat-input button{
background:#2563eb;
color:white;
border:none;
padding:10px;
}

#chat-toggle{
position:fixed;
bottom:20px;
right:20px;
background:#2563eb;
color:white;
padding:12px;
border-radius:50%;
cursor:pointer;
font-size:20px;
}

/* MAP */
#map{
height:400px;
width:100%;
border-radius:10px;
}

/* MEGA MENU */


/* ================= MEGA MENU PREMIUM ================= */

.mega-menu {
    width: 100%;
    left: 0;
    right: 0;
    top: 100%;
    border-radius: 12px;
    background: #fff;
    padding: 25px 10px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
    border-top: 3px solid #ffc107;
}

/* Column spacing */
.mega-menu .row > div {
    padding: 0 20px;
}

/* Section Title */
.menu-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #111;
}

/* Links */
/* LINKS */
.mega-menu a {
    display: block;
    font-size: 14px;
    color: #555;
    padding: 6px 0 6px 0;
    text-decoration: none;
    transition: all 0.3s ease;
    position: relative;
}

/* ARROW */
.mega-menu a::before {
    content: "›";
    position: absolute;
    left: 0;
    opacity: 0;
    transition: 0.3s ease;
    color: #0d6efd;
}

/* HOVER */
.mega-menu a:hover {
    color: #0d6efd;
    padding-left: 14px;  /* space for arrow */
    background: #f1f5ff;
    border-radius: 6px;
}

/* SHOW ARROW */
.mega-menu a:hover::before {
    left: 6px;   /* ✔ inside spacing */
    opacity: 1;
}

/* ================= FOOTER PREMIUM UPGRADE ================= */

.footer-section{
    background: linear-gradient(135deg,#0f172a,#020617);
    color:#fff;
    padding:60px 0 30px;
    font-size:14px;
}

/* LOGO + BRAND */
.footer-brand{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:15px;
}

.footer-logo{
    width:40px;
    height:40px;
    object-fit:contain;
}

.footer-brand h5{
    margin:0;
    font-weight:700;
    font-size:20px;
}

/* TEXT */
.footer-section p{
    color:#cbd5e1;
    line-height:1.7;
}

/* LINKS */
.footer-links{
    list-style:none;
    padding:0;
}

.footer-links li{
    margin-bottom:10px;
}

.footer-links a{
    color:#cbd5e1;
    text-decoration:none;
    transition:0.3s;
    display:inline-block;
}

.footer-links a:hover{
    color:#38bdf8;
    transform:translateX(5px);
}

/* SOCIAL ICONS */
.social-icons{
    margin-top:15px;
}

.social-icons a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#1e293b;
    margin-right:8px;
    color:#fff;
    font-size:16px;
    transition:0.3s;
}

.social-icons a:hover{
    background:#0d6efd;
    transform:translateY(-3px);
}

/* DIVIDER */
.footer-divider{
    border-top:1px solid rgba(255,255,255,0.1);
    margin:25px 0;
}

/* COPYRIGHT */
.footer-copy{
    text-align:center;
    color:#94a3b8;
    font-size:13px;
}

/* HORIZONTAL SCROLL */
/* WRAPPER FIX */
.latest-wrapper{
    margin-top:20px;
    padding:0 10px;
    position: relative;
    overflow: hidden;
}

/* HORIZONTAL SCROLL */
.property-scroll{
    display:flex;
    gap:16px;
    overflow-x:auto;
    scroll-behavior:smooth;
    padding-bottom:10px;
    padding-left: 10px;
    scroll-snap-type: x mandatory;
}

.property-scroll::-webkit-scrollbar{
    display:none;
}

/* CARD WIDTH FIX */
.property-item{
    min-width:300px;
    max-width:300px;
    flex:0 0 auto;
    scroll-snap-align: start;
}

/* ARROWS FIX */


/* LEFT RIGHT POSITION */
.scroll-btn.left{
    left:-10px;
}

.scroll-btn.right{
    right:-10px;
}

/* HOVER */
.scroll-btn:hover{
    background:#0d6efd;
    color:#fff;
}




/* ================= PREMIUM BADGES ================= */

/* FEATURED */
.badge-featured-modern{
    position:absolute;
    top:12px;
    left:12px;
    background:linear-gradient(135deg,#ff7a18,#ff3d00);
    color:#fff;
    font-size:12px;
    font-weight:600;
    padding:6px 12px;
    border-radius:20px;
    box-shadow:0 4px 12px rgba(0,0,0,0.25);
    z-index:5;
}

/* CONSTRUCTION STATUS */
.badge-status-modern{
    position:absolute;
    top:48px;
    left:12px;
    display:flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    font-size:12px;
    font-weight:500;
    border-radius:20px;
    backdrop-filter: blur(8px);
    background:rgba(255,255,255,0.15);
    color:#fff;
    z-index:5;
}

/* DOT */
.status-dot{
    width:8px;
    height:8px;
    border-radius:50%;
}

/* COLORS */
.status-ready{
    background:rgba(16,185,129,0.9);
}
.status-ready .status-dot{
    background:#065f46;
}

.status-under{
    background:rgba(245,158,11,0.9);
}
.status-under .status-dot{
    background:#78350f;
}

.status-new{
    background:rgba(59,130,246,0.9);
}
.status-new .status-dot{
    background:#1e3a8a;
}

/* AVAILABILITY */
.badge-availability-modern{
    position:absolute;
    top:84px;
    left:12px;
    font-size:12px;
    padding:5px 10px;
    border-radius:20px;
    font-weight:500;
    z-index:5;
}

.badge-availability-modern.online{
    background:#16a34a;
    color:#fff;
}

.badge-availability-modern.offline{
    background:#dc2626;
    color:#fff;
}


/* Make dropdown full-width properly */
.navbar .dropdown.position-static {
    position: static !important;
}


#latestScroll::-webkit-scrollbar{
    display:none;
}

#latestScroll .latest-item{
    min-width:300px;
    max-width:300px;
    flex:0 0 300px;
}


.hero-bg{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    top:0;
    left:0;
}

.hero-dark{
    position:absolute;
    inset:0;
    background:linear-gradient(to right,
    rgba(0,0,0,0.7),
    rgba(0,0,0,0.3));
}

.hero-content{
    position:relative;
    z-index:5;
}

.hero-text{
    color:#fff;
    margin-bottom:40px;
}

.hero-text h1{
    font-size:52px;
    font-weight:700;
    margin-bottom:10px;
}

.hero-text p{
    font-size:20px;
    opacity:0.95;
}

/* SEARCH BOX */

/* TABS */

.search-tabs{
    display:flex;
    border-bottom:1px solid #eee;
}

.search-tabs button{
    flex:1;
    border:none;
    background:#fff;
    padding:18px;
    font-weight:600;
    font-size:16px;
    cursor:pointer;
    transition:0.3s;
}

.search-tabs button.active{
    color:#0d6efd;
    border-bottom:3px solid #0d6efd;
}

/* SEARCH MAIN */

.search-main{
    display:flex;
    align-items:center;
    padding:18px;
    gap:15px;
}

.search-select{
    width:220px;
    height:56px;
    border:1px solid #ddd;
    border-radius:10px;
    padding:0 15px;
}

.search-input-modern{
    flex:1;
    height:56px;
    border:1px solid #ddd;
    border-radius:10px;
    padding:0 20px;
    font-size:15px;
}

.search-input-modern:focus,
.search-select:focus{
    outline:none;
    border-color:#0d6efd;
}

.search-btn-modern{
    height:56px;
    padding:0 35px;
    border:none;
    border-radius:10px;
    background:#0d6efd;
    color:#fff;
    font-weight:600;
    transition:0.3s;
}

.search-btn-modern:hover{
    background:#084298;
}




/* =========================
   PREMIUM 99ACRES HEADER
========================= */

.top-header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:9999;
    padding:18px 0;
    transition:0.3s;
}

.top-header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

/* LOGO */

.top-logo{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
}

.top-logo img{
    height:42px;
}

.logo-text-wrap{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.logo-title{
    color:#fff;
    font-size:26px;
    font-weight:700;
}

.logo-tagline{
    color:#ddd;
    font-size:11px;
    letter-spacing:0.3px;
}

/* MENU */

.top-menu{
    display:flex;
    align-items:center;
    gap:28px;
    list-style:none;
    margin:0;
    padding:0;
}

.top-menu li{
    position:relative;
}

.top-menu a{
    color:#fff;
    text-decoration:none;
    font-size:15px;
    font-weight:500;
    transition:0.3s;
}

.top-menu a:hover{
    color:#ffc107;
}

/* NEW BADGE */

.new-badge{
    background:#ff3b30;
    color:#fff;
    font-size:10px;
    padding:2px 6px;
    border-radius:4px;
    margin-left:5px;
}

/* RIGHT */

.top-right{
    display:flex;
    align-items:center;
    gap:18px;
}

/* POST BUTTON */

.post-btn{
    background:#fff;
    color:#111 !important;
    padding:12px 18px;
    border-radius:12px;
    text-decoration:none;
    font-weight:600;
    box-shadow:0 5px 20px rgba(0,0,0,0.15);
}

.post-btn span{
    background:#16a34a;
    color:#fff;
    padding:3px 6px;
    border-radius:4px;
    font-size:11px;
    margin-left:5px;
}

/* ACCOUNT */

.my-account{
    display:flex;
    align-items:center;
    gap:8px;
    color:#fff;
    font-weight:500;
}

.my-account i{
    font-size:22px;
}

/* MEGA MENU */

.mega-dropdown{
    position:absolute;
    top:45px;
    left:-180px;
    width:820px;
    background:#fff;
    border-radius:18px;
    padding:30px;
    display:none;
    gap:35px;
    box-shadow:0 20px 60px rgba(0,0,0,0.18);
}

.dropdown-hover:hover .mega-dropdown{
    display:flex;
}

.mega-column{
    flex:1;
}

.mega-column h6{
    font-size:13px;
    font-weight:700;
    margin-bottom:16px;
    color:#111827;
    letter-spacing:0.5px;
}

.mega-column a{
    display:block;
    color:#555;
    margin-bottom:12px;
    font-size:14px;
    transition:0.3s;
}

.mega-column a:hover{
    color:#0d6efd;
    padding-left:5px;
}

/* DEALER BOX */

.dealer-box{
    margin-top:25px;
    background:#f8fafc;
    border-radius:14px;
    padding:18px;
}

.dealer-box h5{
    font-size:16px;
    font-weight:700;
    margin-bottom:8px;
    color:#111;
}

.dealer-box p{
    font-size:14px;
    color:#555;
    margin-bottom:14px;
}

.dealer-post-btn{
    display:inline-block;
    background:#0d6efd;
    color:#fff !important;
    padding:10px 18px;
    border-radius:10px;
    font-weight:600;
    margin-bottom:12px;
}

.dealer-box small{
    color:#666;
    line-height:1.6;
    display:block;
}

/* BUILDER */

.builder-link{
    margin-top:20px;
}

.builder-link a{
    color:#0d6efd;
    font-weight:600;
}

/* MOBILE BUTTON */



/* MOBILE MENU */

.mobile-menu-wrap{
    background:#fff;
    border-top:1px solid rgba(255,255,255,0.1);
}

.mobile-menu-inner{
    display:flex;
    flex-direction:column;
    padding:20px;
}

.mobile-menu-inner a{
    padding:12px 0;
    color:#111;
    text-decoration:none;
    border-bottom:1px solid #eee;
    font-weight:500;
}

/* MOBILE */


html,
body{
    overflow-x:hidden;
}

/* =========================================
   DESKTOP IMPROVEMENTS
========================================= */

.property-card{
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
    transition:0.35s ease;
    display:flex;
    flex-direction:column;
    height:100%;
}

.property-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,0.16);
}

.property-img{
    position:relative;
    height:230px;
    overflow:hidden;
}

.property-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:0.5s ease;
}

.property-card:hover .property-img img{
    transform:scale(1.08);
}

.property-info{
    padding:18px;
    display:flex;
    flex-direction:column;
    flex:1;
}

.property-info .btn{
    margin-top:auto;
}

/* =========================================
   HERO SECTION
========================================= */

.hero-modern{
    position:relative;
    height:620px;
    display:flex;
    align-items:center;
    overflow:hidden;
}

.hero-bg{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}

.hero-dark{
    position:absolute;
    inset:0;
    background:linear-gradient(
        to right,
        rgba(0,0,0,0.72),
        rgba(0,0,0,0.35)
    );
}

.hero-content{
    position:relative;
    z-index:5;
}

.hero-text h1{
    font-size:58px;
    font-weight:700;
    line-height:1.2;
    margin-bottom:12px;
    color:#fff;
}

.hero-text p{
    font-size:20px;
    color:#eee;
}

/* =========================================
   SEARCH BOX
========================================= */

.search-wrapper{
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,0.2);
}

.search-tabs{
    display:flex;
    overflow-x:auto;
    scrollbar-width:none;
}

.search-tabs::-webkit-scrollbar{
    display:none;
}

.search-tabs button{
    flex:1;
    min-width:120px;
    border:none;
    background:#fff;
    padding:18px;
    font-weight:600;
    transition:0.3s;
}

.search-tabs button.active{
    color:#0d6efd;
    border-bottom:3px solid #0d6efd;
}

.search-main{
    display:flex;
    gap:14px;
    padding:18px;
    align-items:center;
}

.search-select,
.search-input-modern{
    height:56px;
    border-radius:12px;
    border:1px solid #ddd;
    padding:0 15px;
}

.search-select{
    width:220px;
}

.search-input-modern{
    flex:1;
}

.search-btn-modern{
    height:56px;
    padding:0 30px;
    border:none;
    border-radius:12px;
    background:#0d6efd;
    color:#fff;
    font-weight:600;
}

/* =========================================
   LATEST PROPERTY SLIDER
========================================= */

#latestScroll{
    display:flex;
    gap:18px;
    overflow-x:auto;
    scroll-behavior:smooth;
    padding:10px 5px 20px;
    scrollbar-width:none;
}

#latestScroll::-webkit-scrollbar{
    display:none;
}

#latestScroll .latest-item{
    min-width:320px;
    max-width:320px;
    flex:0 0 320px;
}

/* =========================================
   SCROLL BUTTONS
========================================= */

.scroll-btn{
    position:absolute;
    top:45%;
    transform:translateY(-50%);
    z-index:20;
    width:44px;
    height:44px;
    border:none;
    border-radius:50%;
    background:#fff;
    box-shadow:0 5px 20px rgba(0,0,0,0.15);
    font-size:22px;
    cursor:pointer;
    transition:0.3s;
}

.scroll-btn:hover{
    background:#0d6efd;
    color:#fff;
}

.scroll-btn.left{
    left:-15px;
}

.scroll-btn.right{
    right:-15px;
}

/* =========================================
   MOBILE RESPONSIVE FIX
========================================= */
@media (min-width:992px){

    .dropdown-menu{
        opacity:0;
        transform:translateY(10px);
        transition:all 0.25s ease;
        display:block;
        visibility:hidden;
    }

    .navbar .dropdown:hover .dropdown-menu{
        opacity:1;
        transform:translateY(0);
        visibility:visible;
    }

}

@media (max-width:991px){

    .dropdown-menu{
        display:none;
        opacity:1;
        visibility:visible;
        transform:none;
    }

    .dropdown-menu.show{
        display:block;
    }

}

@media(max-width:768px){

    body,
    html{
        overflow-x:hidden;
    }

    /* HEADER */

    .top-header{
    padding:12px 14px;
    background:#fff;
    box-shadow:0 4px 20px rgba(0,0,0,0.08);
    backdrop-filter:none;
}

/* LOGO TEXT */
.logo-title{
    color:#111 !important;
    font-size:20px;
    font-weight:700;
}

.logo-tagline{
    color:#666 !important;
    font-size:10px;
}

/* MENU ICON */

    .top-header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.header-left{
    display:flex;
    align-items:center;
    gap:12px;
}


.post-btn-modern{
    background:#0d6efd;
    color:#fff;
    text-decoration:none;
    border-radius:14px;
    padding:10px 14px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:600;
    line-height:1.1;
    min-width:92px;
    box-shadow:0 8px 20px rgba(13,110,253,0.25);
}

.post-btn-modern span{
    font-size:11px;
    margin-top:3px;
    color:#dbeafe;
    font-weight:500;
}

    .top-logo{
        gap:8px;
    }

    .top-logo img{
        height:34px;
    }

    .logo-title{
        font-size:18px;
    }



    .hero-bg{
        object-fit:cover;
        object-position:center;
    }

    
    .hero-content{
        width:100%;
        padding:0 14px;
    }

    .hero-text{
        margin-bottom:22px;
        text-align:left;
    }

    .hero-text h1{
        font-size:28px;
        line-height:1.35;
        margin-bottom:10px;
        font-weight:700;
    }

    .hero-text p{
        font-size:15px;
        line-height:1.6;
        color:#eee;
    }

    /* SEARCH */

    .search-wrapper{
        background:#fff;
        border-radius:20px;
        overflow:hidden;
        width:100%;
        box-shadow:0 20px 60px rgba(0,0,0,0.2);
    }

    .search-tabs{
        display:flex;
        overflow-x:auto;
        white-space:nowrap;
        scrollbar-width:none;
        border-bottom:1px solid #eee;
    }

    .search-tabs::-webkit-scrollbar{
        display:none;
    }

    .search-tabs button{
        flex:none;
        min-width:120px;
        padding:14px 18px;
        font-size:14px;
    }

    .search-main{
        display:flex;
        flex-direction:column;
        gap:12px;
        padding:16px;
    }

    .search-select,
    .search-input-modern,
    .search-btn-modern{
        width:100% !important;
        height:52px;
        border-radius:12px;
        font-size:15px;
    }

    /* SECTION */

    

    /* PROPERTY */

    .property-card{
        border-radius:16px;
    }

    .property-img{
        height:190px !important;
    }

    .property-info{
        padding:15px;
    }

    .property-info h5,
    .property-info h6{
        font-size:18px !important;
        line-height:1.4;
    }

    /* LATEST SCROLL */

    #latestScroll{
        padding-left:14px;
        padding-right:14px;
        gap:14px;
    }

    #latestScroll .latest-item{
        min-width:88%;
        max-width:88%;
        flex:0 0 88%;
    }

    #latestScroll .property-card{
        width:100% !important;
        height:100%;
    }

    #latestScroll .property-img{
        height:180px !important;
    }

    #latestScroll h6{
        font-size:22px !important;
        font-weight:700;
    }

    /* CTA */

    .cta-title{
        font-size:28px;
    }

    .cta-buttons{
        justify-content:flex-start;
        margin-top:20px;
    }

    /* CITY */

    .city-card{
        border-radius:10px;
        overflow:hidden;
        box-shadow:0 5px 20px rgba(0,0,0,0.1);
        text-align:center;
    }

    .city-card img{
        width:100%;
        height:220px;
        object-fit:cover;
    }

    .city-card h4{
        padding:10px;
    }

    /* BLOG */

    .blog-content{
        font-size:17px;
    }

    .blog-content h1{
        font-size:26px;
    }

    .blog-content h2{
        font-size:22px;
    }

    /* FOOTER */

    .footer-section{
        text-align:center;
    }

    .footer-brand{
        justify-content:center;
    }

    .social-icons{
        justify-content:center;
    }

    .footer-links a:hover{
        transform:none;
    }

    /* MOBILE MENU */

    .mobile-menu-wrap{
        background:#111827;
    }

    .mobile-menu-inner{
        padding:10px 18px 20px;
    }

    .mobile-menu-inner a{
        color:#fff;
        padding:14px 0;
        border-bottom:1px solid rgba(255,255,255,0.08);
    }

    /* CHAT */

    #chat-toggle{
        width:58px;
        height:58px;
        bottom:16px;
        right:16px;
        font-size:20px;
    }

    /* HIDE ARROWS */

    .scroll-btn,
    .swiper-button-next,
    .swiper-button-prev,
    .blog-prev,
    .blog-next{
        display:none !important;
    }

    /* CONTAINER */

    .container,
    .container-fluid{
        padding-left:14px !important;
        padding-right:14px !important;
    }

}


@media(max-width:480px){

    .hero-modern{
        min-height:580px;
    }

    .hero-text h1{
        font-size:24px;
    }

    .hero-text p{
        font-size:14px;
    }

   

    #latestScroll .latest-item{
        min-width:92%;
        max-width:92%;
        flex:0 0 92%;
    }

    .search-tabs button{
        padding:13px 16px;
        font-size:13px;
    }

    .search-main{
        padding:14px;
    }

    .search-select,
    .search-input-modern,
    .search-btn-modern{
        height:50px;
        font-size:14px;
    }

}





/* =========================================
   FINAL SEARCH FIX
========================================= */

/* DESKTOP SEARCH WIDTH FIX */
.search-wrapper{
    max-width:1200px;
    width:100%;
    margin:auto;
}

.search-main{
    padding:14px;
    gap:12px;
}

.search-tabs button{
    padding:16px;
    font-size:15px;
}

/* Smaller desktop hero */
.hero-modern{
    height:580px;
}

/* =========================================
   MOBILE TABS FIX
========================================= */

@media(max-width:768px){

    /* SEARCH WRAPPER */
    .search-wrapper{
        width:100%;
        border-radius:18px;
        overflow:hidden;
    }

    /* TABS FIX */
    .search-tabs{
        display:flex;
        flex-wrap:nowrap;
        overflow-x:auto;
        overflow-y:hidden;
        white-space:nowrap;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }

    .search-tabs::-webkit-scrollbar{
        display:none;
    }

    .search-tabs button{
        flex:0 0 auto !important;
        min-width:max-content;
        padding:14px 16px;
        font-size:14px;
        white-space:nowrap;
    }

    /* SEARCH FORM */
    .search-main{
        display:flex;
        flex-direction:column;
        padding:15px;
        gap:12px;
    }

    .search-select,
    .search-input-modern,
    .search-btn-modern{
        width:100% !important;
    }

}

/* SMALL MOBILE */
@media(max-width:480px){

    .search-tabs button{
        padding:13px 14px;
        font-size:13px;
    }

}




/* =========================================
   MOBILE SEARCH INPUT HEIGHT FIX
========================================= */

@media(max-width:768px){

    .search-input-modern,
    .search-select{
        height:58px !important;
        min-height:58px !important;
        padding:0 16px !important;
        font-size:15px !important;
        border-radius:12px;
    }

    .search-btn-modern{
        height:58px !important;
        font-size:15px !important;
        font-weight:600;
    }

}




/* =========================================
   MOBILE HERO FIX LIKE 99ACRES
========================================= */

@media(max-width:768px){

    
    .hero-text{
        display:block !important;
        margin-bottom:22px !important;
    }

    .hero-text h1{
        display:block !important;
        font-size:30px !important;
        line-height:1.4 !important;
        margin-bottom:12px !important;
        color:#fff;
    }

    .hero-text p{
        display:block !important;
        font-size:15px !important;
        line-height:1.7 !important;
        color:#f1f1f1;
    }

    /* SEARCH BOX DOWN */
    .search-wrapper{
        margin-top:20px !important;
        position:relative;
        z-index:5;
    }

}

@media(max-width:768px){

    .top-logo{
        align-items:flex-start;
    }

    .logo-text-wrap{
        display:flex;
        flex-direction:column;
        line-height:1.2;
    }

    .logo-title{
        font-size:20px;
        font-weight:700;
    }

    /* SHOW TAGLINE */
    .logo-tagline{
        display:block !important;
        font-size:10px;
        color:#f1f1f1;
        margin-top:2px;
        white-space:nowrap;
    }

}


/* HERO SEARCH DOWN LIKE 99ACRES */
@media(max-width:768px){


    .search-wrapper{
        margin-top:25px;
    }

}




/* =========================================
   MOBILE SEARCH ONLY INPUT + BUTTON
========================================= */

/* DESKTOP */
.desktop-only{
    display:block;
}

.mobile-search-wrap{
    display:flex;
    gap:12px;
    flex:1;
}

/* MOBILE */
@media(max-width:768px){

    /* HIDE CITY DROPDOWN */
    .desktop-only{
        display:none !important;
    }

    /* INPUT + BUTTON IN SAME ROW */
    .mobile-search-wrap{
        width:100%;
        display:flex;
        align-items:center;
        gap:10px;
    }

    .search-input-modern{
        flex:1;
        height:56px !important;
        border-radius:14px;
        font-size:15px;
    }

    .search-btn-modern{
        width:110px;
        min-width:110px;
        height:56px !important;
        border-radius:14px;
        font-size:15px;
        font-weight:600;
    }

}



/* =========================================
   PREMIUM MOBILE SEARCH UI
========================================= */

@media(max-width:768px){

    /* HIDE TABS */
    .search-tabs{
        display:none !important;
    }

    /* SEARCH WRAPPER */
    .search-wrapper{
        background:#fff;
        border-radius:22px;
        padding:14px;
        box-shadow:
        0 10px 35px rgba(0,0,0,0.12);
        margin-top:20px;
    }

    /* SEARCH AREA */
    .search-main{
        padding:0 !important;
        display:block;
    }

    /* INPUT + BUTTON */
    .mobile-search-wrap{
        display:flex;
        align-items:center;
        gap:10px;
        width:100%;
    }

    /* INPUT */
    .search-input-modern{
        flex:1;
        height:56px !important;
        border-radius:16px !important;
        border:1px solid #e5e7eb !important;
        background:#f8fafc;
        padding:0 18px !important;
        font-size:15px !important;
        box-shadow:none !important;
    }

    .search-input-modern:focus{
        border-color:#0d6efd !important;
        background:#fff;
    }

    /* BUTTON */
    .search-btn-modern{
        height:56px !important;
        min-width:56px;
        width:56px;
        border-radius:16px !important;
        padding:0 !important;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:0;
        background:#0d6efd;
    }

    /* SEARCH ICON */
    .search-btn-modern::before{
        content:"🔍";
        font-size:20px;
    }

}



/* =========================================
   FINAL MOBILE SEARCH FIX
========================================= */

@media(max-width:768px){

    /* HIDE TABS */
    .search-tabs{
        display:none !important;
    }

    /* SEARCH WRAPPER */
    .search-wrapper{
        background:#fff;
        border-radius:20px;
        padding:12px;
        box-shadow:0 10px 30px rgba(0,0,0,0.12);
        margin-top:18px;
    }

    /* SEARCH MAIN */
    .search-main{
        padding:0 !important;
        display:block;
    }

    /* INPUT + BUTTON ROW */
    .mobile-search-wrap{
        display:flex;
        align-items:center;
        gap:8px;
        width:100%;
    }

    /* INPUT */
    .search-input-modern{
        flex:1 !important;
        width:auto !important;
        height:54px !important;
        border-radius:14px !important;
        border:1px solid #e5e7eb !important;
        background:#f8fafc;
        padding:0 16px !important;
        font-size:15px !important;
    }

    /* BUTTON */
    .search-btn-modern{
        flex:0 0 54px !important;
        width:54px !important;
        min-width:54px !important;
        max-width:54px !important;
        height:54px !important;
        border-radius:14px !important;
        padding:0 !important;
        border:none;
        background:#0d6efd;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:0 !important;
    }

    /* ICON */
    .search-btn-modern::before{
        content:"🔍";
        font-size:18px;
    }

}


/* =========================================
   HERO SEARCH AT IMAGE BORDER
========================================= */

.hero-modern{
    position:relative;
    display:flex;
    align-items:flex-end !important;
    padding-bottom:40px;
}

/* CONTENT TO BOTTOM */
.hero-content{
    width:100%;
    position:relative;
    z-index:5;
}

/* SEARCH BOX */
.search-wrapper{
    margin-bottom:-55px;
    position:relative;
    z-index:20;
}

/* MOBILE */
@media(max-width:768px){

    .hero-modern{
        min-height:520px !important;
        padding-bottom:25px;
    }

    /* FULL WIDTH SEARCH */
    .search-wrapper{
        margin-bottom:-170px;
        border-radius:22px;

        width:calc(100vw - 24px) !important;
        max-width:calc(100vw - 24px) !important;

        margin-left:10% !important;
        transform:translateX(-50%);

        padding:14px;
    }

}

/* SEARCH SLIDER */
.search-input-slider-wrap{
    position:relative;
    flex:1;
    height:56px;
    background:#f8fafc;
    border:1px solid #e5e7eb;
    border-radius:16px;
    overflow:hidden;
    display:flex;
    align-items:center;
    padding:0 16px;
}

/* REAL INPUT */
.search-input-modern{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    background:transparent;
    border:none !important;
    z-index:5;
    padding:0 16px 0 78px !important;
}

.search-input-modern:focus{
    outline:none;
    background:transparent;
}

/* STATIC TEXT */
.search-static-text{
    position:absolute;
    left:16px;
    font-size:15px;
    font-weight:500;
    color:#9ca3af;
    z-index:2;
}

/* SLIDING TEXT */
.search-slider{
    position:absolute;
    left:78px;
    height:22px;
    overflow:hidden;
    z-index:1;
}

/* ITEMS */
.search-slider span{
    display:block;
    height:22px;
    line-height:22px;
    color:#666;
    font-size:14px;
    animation:slideSearch 10s infinite;
}

/* ANIMATION */
@keyframes slideSearch{

    0%{
        transform:translateY(0);
    }

    20%{
        transform:translateY(0);
    }

    25%{
        transform:translateY(-22px);
    }

    45%{
        transform:translateY(-22px);
    }

    50%{
        transform:translateY(-44px);
    }

    70%{
        transform:translateY(-44px);
    }

    75%{
        transform:translateY(-66px);
    }

    95%{
        transform:translateY(-66px);
    }

    100%{
        transform:translateY(0);
    }

}



/* =========================================
   PREMIUM TRIANGLE HERO
========================================= */

.hero-modern{
    background:linear-gradient(135deg,#7f1d1d,#b91c1c);
    padding:130px 0 20px;
    position:relative;
    overflow:hidden;
}

/* SOFT DESIGN SHAPES */
.hero-modern::before{
    content:"";
    position:absolute;
    width:500px;
    height:500px;
    background:rgba(255,255,255,0.04);
    border-radius:50%;
    top:-180px;
    right:-120px;
}

.hero-modern::after{
    content:"";
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(255,255,255,0.03);
    border-radius:50%;
    bottom:-140px;
    left:-120px;
}

/* GRID */
.hero-grid{
    display:flex;
    align-items:center;
    gap:70px;
    position:relative;
    z-index:2;
}

/* =========================================
   IMAGE SIDE
========================================= */

.hero-image-side{
    flex:1;
    min-width:0;
}

/* PREMIUM TRIANGLE */
.hero-triangle-image{
    position:relative;
    width:100%;
    height:520px;
    overflow:hidden;

    clip-path:polygon(
        0 0,
        100% 0,
        88% 100%,
        0% 82%
    );

    border-radius:28px;

    box-shadow:
    0 25px 70px rgba(0,0,0,0.35);

    background:#fff;
}

/* IMAGE */
.hero-triangle-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:0.5s ease;
}

.hero-triangle-image:hover img{
    transform:scale(1.04);
}

/* =========================================
   CONTENT SIDE
========================================= */

.hero-content-side{
    flex:1;
    min-width:0;
    color:#fff;
}

/* BADGE */
.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;

    background:rgba(255,255,255,0.15);
    backdrop-filter:blur(10px);

    color:#fff;

    padding:10px 18px;
    border-radius:50px;

    font-size:13px;
    font-weight:700;

    margin-bottom:22px;

    border:1px solid rgba(255,255,255,0.18);
}

/* TITLE */
.hero-title{
    font-size:58px;
    line-height:1.1;
    font-weight:800;
    margin-bottom:18px;
    color:#fff;
    letter-spacing:-1px;
}

/* LOCATION */
.hero-location{
    font-size:18px;
    line-height:1.7;
    margin-bottom:18px;
    color:#ffe4e6;
}

/* PRICE */
.hero-price{
    font-size:42px;
    font-weight:800;
    margin-bottom:30px;
    color:#fff;
}

/* BUTTON */
.hero-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    background:#fff;
    color:#991b1b;

    text-decoration:none;

    padding:16px 34px;

    border-radius:16px;

    font-weight:700;
    font-size:15px;

    transition:0.3s ease;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.18);
    margin-bottom:40px;
}

.hero-btn:hover{
    background:#111;
    color:#fff;
    transform:translateY(-3px);
}

/* =========================================
   HEADER FIX ON RED BACKGROUND
========================================= */

.top-header{
    background:transparent !important;
}

.top-menu a{
    color:#fff !important;
}

.logo-title{
    color:#fff !important;
}

.logo-tagline{
    color:#f3f4f6 !important;
}

.my-account{
    color:#fff !important;
}



@media(max-width:991px){

    .hero-modern{
        padding:120px 0 70px;
    }

    .hero-grid{
        gap:35px;
    }

    .hero-title{
        font-size:42px;
    }

}

/* =========================================
   MOBILE PREMIUM
========================================= */

@media(max-width:768px){

    .hero-modern{
        padding:20px 0 120px;
    }

    /* KEEP LEFT RIGHT */
    .hero-grid{
        display:grid;
        grid-template-columns:42% 58%;
        align-items:center;
        gap:16px;
    }

    /* IMAGE */
   

    /* CONTENT */
    .hero-content-side{
        width:100%;
    }

    /* BADGE */
    .hero-badge{
        font-size:10px;
        padding:7px 12px;
        margin-bottom:10px;
    }

    /* TITLE */
    .hero-title{
        font-size:24px;
        line-height:1.3;
        margin-bottom:10px;

        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
    }

    /* LOCATION */
    .hero-location{
        font-size:13px;
        line-height:1.5;
        margin-bottom:10px;
    }

    /* PRICE */
    .hero-price{
        font-size:24px;
        margin-bottom:16px;
    }

    /* BUTTON */
    .hero-btn{
        width:100%;
        height:46px;
        padding:0 14px;
        font-size:13px;
        border-radius:12px;
    }

}

/* =========================================
   SMALL MOBILE
========================================= */

@media(max-width:480px){

    .hero-grid{
        grid-template-columns:40% 60%;
        gap:12px;
    }

    .hero-triangle-image{
        height:190px;
    }

    .hero-title{
        font-size:20px;
    }

    .hero-price{
        font-size:20px;
    }

    .hero-btn{
        height:42px;
        font-size:12px;
    }

}

/* MOBILE MENU BUTTON PERFECT ALIGN */
.mobile-menu-btn{
    background:none;
    border:none;
    color:#fff !important;

    font-size:28px;
    padding:0;

    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-top:-2px; /* little upper shift */
    margin-left:-30px; /* little left shift */

    line-height:1;
}





/* =========================================
   MOBILE LOGO PERFECT ALIGN
========================================= */

@media(max-width:768px){

    .top-logo{
        display:flex;
        align-items:center;
        gap:7px;

        margin-left:-10px; /* shift whole logo left */
    }

    .top-logo img{
        height:34px;
        width:auto;

        margin-left:-4px; /* image little more left */
    }

    .logo-text-wrap{
        display:flex;
        flex-direction:column;
        line-height:1.1;

        margin-left:-4px; /* text little left */
    }

    .logo-title{
        font-size:19px;
        font-weight:700;
        margin:0;
    }

    .logo-tagline{
        font-size:10px;
        margin-top:1px;
    }

}



/* MOBILE RIGHT BUTTON FIX */
@media(max-width:768px){

    .top-right{
        display:flex;
        align-items:center;
        gap:10px;
        margin-right:-10px;
    }

    /* POST BUTTON */
    .post-btn-modern{
        background:#fff !important;
        color:#111 !important;

        height:42px;
        padding:0 14px;

        border-radius:12px;

        display:flex;
        align-items:center;
        justify-content:center;
        flex-direction:row !important;

        gap:5px;

        font-size:13px;
        font-weight:700;

        white-space:nowrap;

        box-shadow:0 6px 20px rgba(0,0,0,0.10);
    }

    /* FREE TEXT */
    .post-btn-modern span{
        color:#16a34a !important;
        font-size:11px;
        font-weight:700;
        margin:0 !important;
    }

}



/* =========================
   PREMIUM HERO IMAGE
========================= */

.hero-triangle-image{
    position: relative;
    width: 100%;
    height: 560px; /* desktop more premium */
    overflow: hidden;

    /* smoother modern premium cut */
    clip-path: polygon(
        0 0,
        100% 0,
        92% 100%,
        0 86%
    );

    border-radius: 34px;

    background: #fff;

    /* richer premium shadow */
    box-shadow:
        0 35px 90px rgba(0,0,0,0.28),
        0 10px 30px rgba(0,0,0,0.12);

    /* smooth animation */
    transition: all 0.45s ease;
}

/* optional premium overlay */
.hero-triangle-image::before{
    content:'';
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(0,0,0,0.28),
            rgba(0,0,0,0.02)
        );

    z-index:1;
    pointer-events:none;
}

.hero-triangle-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;

    transition:transform 0.7s ease;
}

/* smoother premium hover */
.hero-triangle-image:hover img{
    transform:scale(1.06);
}

/* subtle lift effect */
.hero-triangle-image:hover{
    transform:translateY(-6px);
}

/* =========================
   TABLET
========================= */
@media(max-width:991px){

    .hero-triangle-image{
        height:430px;

        clip-path: polygon(
            0 0,
            100% 0,
            90% 100%,
            0 90%
        );

        border-radius:24px;
    }

}

/* =========================
   MOBILE
========================= */
@media(max-width:576px){

    .hero-triangle-image{
        height:260px; /* increased mobile height */

        clip-path: polygon(
            0 0,
            100% 0,
            92% 100%,
            0 92%
        );

        border-radius:18px;
    }

}



/* =========================================
   FINAL MOBILE HERO TOP SPACING FIX
========================================= */

@media(max-width:768px){

    .hero-modern{
        padding:85px 0 120px; /* top reduced */
        min-height:auto !important;
        height:auto !important;

        display:flex;
        align-items:center;
    }

    .hero-content{
        padding-top:0 !important;
    }

}








/* =========================================
   PROPERTY TYPE SLIDER
========================================= */

.property-type-section{
    padding:70px 0 20px;
    position:relative;
}

/* TOP NAV */
.type-nav{
    display:flex;
    gap:10px;
}

/* BUTTON */
.type-btn{
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:#fff;
    box-shadow:0 6px 18px rgba(0,0,0,0.12);
    cursor:pointer;
    transition:0.3s;
}

.type-btn:hover{
    background:#0d6efd;
    color:#fff;
}

/* HORIZONTAL SCROLL */
.property-type-scroll{
    display:flex;
    gap:18px;

    overflow-x:auto;
    scroll-behavior:smooth;

    padding-bottom:10px;

    scrollbar-width:none;
}

.property-type-scroll::-webkit-scrollbar{
    display:none;
}

/* CARD */
.property-type-card{
    min-width:280px;
    max-width:280px;

    flex:0 0 auto;

    background:#fff;

    border-radius:22px;

    padding:24px;

    display:flex;
    align-items:center;
    gap:18px;

    text-decoration:none;

    transition:0.35s ease;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.06);

    border:1px solid #eef2f7;
}

/* HOVER */
.property-type-card:hover{
    transform:translateY(-6px);

    box-shadow:
    0 18px 40px rgba(0,0,0,0.12);

    border-color:#dbeafe;
}

/* ICON */
.type-icon{
    width:72px;
    height:72px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:34px;

    flex-shrink:0;
}

/* CONTENT */
.type-content h5{
    font-size:19px;
    font-weight:700;
    color:#111827;
    margin-bottom:5px;
}

.type-content p{
    margin:0;
    color:#6b7280;
    font-size:14px;
}

/* COLORS */

.house .type-icon{
    background:#eff6ff;
}

.apartment .type-icon{
    background:#f5f3ff;
}

.commercial .type-icon{
    background:#fff7ed;
}

.plot .type-icon{
    background:#ecfdf5;
}

.floor .type-icon{
    background:#fdf2f8;
}

.studio .type-icon{
    background:#f3f4f6;
}

/* MOBILE */
@media(max-width:768px){

    .property-type-section{
        padding-top:50px;
    }

    .property-type-card{
        min-width:240px;
        max-width:240px;

        padding:18px;
        border-radius:18px;
    }

    .type-icon{
        width:58px;
        height:58px;
        font-size:28px;
        border-radius:14px;
    }

    .type-content h5{
        font-size:16px;
    }

    .type-content p{
        font-size:13px;
    }

    /* HIDE BUTTONS */
    .type-nav{
        display:none;
    }

}




/* =========================================
   FINAL PREMIUM FLOATING SEARCH
========================================= */

/* HERO */
/* =========================================
   PREMIUM FLOATING SEARCH
========================================= */

/* HERO */
.hero-modern{
    position:relative;
    overflow:visible !important;

    min-height:720px;

    display:flex;
    align-items:center;

    padding:120px 0 140px;
}

/* CONTENT */
.hero-content{
    width:100%;
    position:relative;
    z-index:5;
}

/* FLOAT SEARCH */
.search-wrapper{
    position:absolute;

    left:50%;
    bottom:-150px;

    transform:translateX(-50%);

    width:100%;
    max-width:1180px;

    z-index:50;

    background:#fff;

    border-radius:26px;

    box-shadow:
    0 30px 80px rgba(0,0,0,0.16);

    overflow:hidden;
}

/* SECTION GAP */
.property-type-section{
    padding-top:140px;
}

/* =========================================
   TABS
========================================= */

.search-tabs{
    display:flex;
    border-bottom:1px solid #eef2f7;
    background:#fff;
}

.search-tabs button{
    flex:1;
    border:none;
    background:#fff;

    padding:20px;

    font-size:15px;
    font-weight:600;

    transition:0.3s;
}

.search-tabs button.active{
    color:#0d6efd;
    border-bottom:3px solid #0d6efd;
}

/* =========================================
   SEARCH MAIN
========================================= */

.search-main{
    display:flex;
    align-items:center;
    gap:14px;

    padding:18px;
}

/* SEARCH WRAP */
.mobile-search-wrap{
    display:flex;
    align-items:center;
    gap:14px;
    width:100%;
}

/* INPUT AREA */
.search-input-slider-wrap{
    position:relative;
    flex:1;
    height:64px;

    background:#fff;

    border:1px solid #e5e7eb;
    border-radius:18px;

    overflow:hidden;

    display:flex;
    align-items:center;
}

/* LEFT SEARCH ICON */
.search-static-icon{
    position:absolute;
    left:20px;
    z-index:5;

    color:#6b7280;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* INPUT */
.search-input-modern{
    width:100%;
    height:100%;

    border:none !important;
    background:transparent;

    padding:0 70px 0 60px !important;

    font-size:16px !important;

    color:#111;
}

.search-input-modern:focus{
    outline:none;
}

/* SLIDER */
.search-slider{
    position:absolute;
    left:60px;

    height:24px;
    overflow:hidden;

    color:#9ca3af;

    pointer-events:none;
}

.search-slider span{
    display:block;

    height:24px;
    line-height:24px;

    color:#666;
    font-size:15px;

    animation:slideSearch 10s infinite;
}

/* =========================================
   VOICE BUTTON INSIDE
========================================= */

.desktop-voice{
    position:absolute;
    right:12px;

    width:42px;
    height:42px;

    border:none;
    border-radius:12px;

    background:#f3f4f6;
    color:#374151;

    display:flex;
    align-items:center;
    justify-content:center;

    transition:0.3s;
}

.desktop-voice:hover{
    background:#e5e7eb;
}

/* =========================================
   DESKTOP SEARCH BUTTON
========================================= */

.desktop-search-btn{
    height:64px;
    padding:0 32px;

    border:none;
    border-radius:18px;

    background:#fff;
    color:#111;

    font-size:16px;
    font-weight:700;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.08);

    transition:0.3s;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}

.desktop-search-btn:hover{
    background:#111;
    color:#fff;

    transform:translateY(-2px);
}

/* MOBILE SEARCH BUTTON */
.search-btn-mobile{
    display:none;
}

/* =========================================
   MOBILE
========================================= */

@media(max-width:768px){

    .hero-modern{
        min-height:auto;
        padding:90px 0 130px;
    }

    /* SEARCH WRAPPER */
    .search-wrapper{

        width:calc(100% - 24px);
        max-width:calc(100% - 24px);

        left:40%;
        bottom:-1px;

        transform:translateX(-50%);

        border-radius:22px;

        padding:14px;
    }

    /* HIDE TABS */
    .search-tabs{
        display:none !important;
    }

    /* SECTION GAP */
    .property-type-section{
        padding-top:70px;
    }

    /* SEARCH */
    .search-main{
        padding:0 !important;
        display:block;
    }

    /* ROW */
    .mobile-search-wrap{
        display:flex;
        align-items:center;
        gap:10px;
    }

    /* INPUT */
    .search-input-slider-wrap{
        height:54px;
        border-radius:16px;
    }

    /* INPUT TEXT */
    .search-input-modern{
        padding:0 56px 0 52px !important;
        font-size:15px !important;
    }

    /* SEARCH ICON */
    .search-static-icon{
        left:16px;
    }

    /* SLIDER */
    .search-slider{
        left:52px;
        font-size:14px;
    }

    /* HIDE DESKTOP BUTTON */
    .desktop-search-btn{
        display:none !important;
    }

    /* SHOW VOICE IN MOBILE */
    .desktop-voice{
        display:flex !important;

        width:38px;
        height:38px;

        right:8px;

        border-radius:10px;
    }

    /* MOBILE SEARCH BUTTON */
    .search-btn-mobile{
        display:flex;

        width:54px;
        min-width:54px;
        height:54px;

        border:none;
        border-radius:16px;

        background:#fff;
        color:#111;

        align-items:center;
        justify-content:center;

        box-shadow:
        0 8px 25px rgba(0,0,0,0.08);
    }

}


.section-title{
    font-size:20px;
    font-weight:300;
    line-height:1.2;

    letter-spacing:-0.5px;

    color:#888b93;

    font-family:'Poppins', sans-serif;
}


@media(max-width:768px){

    .section-title{
        font-size:16px;
        font-weight:300;
        line-height:1.1;
        color:#888b93;
    }

}





/* =========================================
POPULAR TOOLS
========================================= */

.popular-tools-section{
    padding:80px 0;
    background:#fff;
}

/* SUBTITLE */
.section-subtitle{
    font-size:14px;
    color:#6b7280;
}

/* TOOLS SCROLL */
.tools-scroll{
    display:flex;
    gap:20px;

    overflow-x:auto;
    scroll-behavior:smooth;

    padding-bottom:10px;

    scrollbar-width:none;
}

.tools-scroll::-webkit-scrollbar{
    display:none;
}

/* CARD */
.tool-card{
    min-width:280px;
    max-width:280px;

    background:#fff;

    border:1px solid #eef2f7;
    border-radius:24px;

    padding:22px;

    display:flex;
    align-items:flex-start;
    gap:18px;

    text-decoration:none;

    transition:0.35s;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.04);
}

/* HOVER */
.tool-card:hover{
    transform:translateY(-6px);

    border-color:#dbeafe;

    box-shadow:
    0 18px 40px rgba(0,0,0,0.08);
}

/* ICON */
.tool-icon{
    width:62px;
    height:62px;

    min-width:62px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* COLORS */
.tool-icon.blue{
    background:#eff6ff;
    color:#2563eb;
}

.tool-icon.green{
    background:#ecfdf5;
    color:#059669;
}

.tool-icon.orange{
    background:#fff7ed;
    color:#ea580c;
}

.tool-icon.purple{
    background:#f5f3ff;
    color:#7c3aed;
}

.tool-icon.red{
    background:#fef2f2;
    color:#dc2626;
}

.tool-icon.cyan{
    background:#ecfeff;
    color:#0891b2;
}

/* CONTENT */
.tool-content h5{
    margin:0 0 6px;

    font-size:18px;
    font-weight:700;

    color:#111827;
}

.tool-content p{
    margin:0;

    font-size:14px;
    line-height:1.6;

    color:#6b7280;
}

/* NAV */
.scroll-btn{
    width:42px;
    height:42px;

    border:none;
    border-radius:50%;

    background:#fff;

    box-shadow:
    0 8px 20px rgba(0,0,0,0.08);

    font-size:22px;
    font-weight:700;

    transition:0.3s;
}

.scroll-btn:hover{
    background:#111827;
    color:#fff;
}


/* MOBILE */
@media(max-width:768px){

    .popular-tools-section{
        padding:60px 0;
    }

    .tool-card{
        min-width:250px;
        max-width:250px;

        padding:18px;
    }

    .tool-content h5{
        font-size:16px;
    }

    .tool-content p{
        font-size:13px;
    }

}