/* =========================================
HX HERO
========================================= */

.hx-hero{
    position:relative;

    width:100%;
    height:620px;

    overflow:hidden;

        background: linear-gradient(135deg, rgba(245, 230, 200, 0.92), rgba(255, 244, 220, 0.88)), url(https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=2070);

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

/* =========================================
TOPBAR
========================================= */

.hx-topbar{
    position:relative;
    z-index:100;

    width:100%;
    height:150px;

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

    padding:0 24px;

    background:rgba(0,0,0,0.08);

    border-bottom:
    1px solid rgba(255,255,255,0.08);
}

/* LEFT */

.hx-left{
    display:flex;
    align-items:center;
    gap:22px;
}

.hx-logo img{
    height:120px;
}

/* MOBILE BUTTON */

.hx-mobile-btn{
    display:none;

    width:46px;
    height:46px;

    border:none;

    border-radius:12px;

    background:#fff;

    color:#4320c2;

    font-size:20px;

    cursor:pointer;
}

/* MENU */

.hx-menu{
    display:flex;
    align-items:center;
    gap:28px;
}

.hx-menu a{
    text-decoration:none;

    color:#1f2226;

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

    transition:0.3s;
}

.hx-menu a:hover{
    opacity:0.8;
}

/* RIGHT */

.hx-right{
    display:flex;
    align-items:center;
    gap:18px;
}

/* CONTACT */

.hx-contact{
    display:flex;
    align-items:center;
    gap:10px;

    background:#fff;

    padding:10px 16px;

    border-radius:12px;
}

.hx-contact i{
    color:#4320c2;
    font-size:16px;
}

.hx-contact span{
    color:#111;

    font-size:14px;
    font-weight:700;
}

/* SOCIAL */

.hx-social{
    display:flex;
    align-items:center;
    gap:10px;
}

.hx-social a{
    width:40px;
    height:40px;

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

    border-radius:12px;

    background:rgba(31,34,38,0.08);

    color:#1f2226;

    text-decoration:none;

    font-size:15px;

    transition:0.3s;
}

.hx-social a:hover{
    background:#1f2226;
    color:#fff;
}

/* =========================================
CONTENT
========================================= */

.hx-content{
    position:relative;
    z-index:10;

    width:100%;
    max-width:1200px;

    margin:auto;

    padding-top:72px;

    text-align:center;
}

.hx-content h1{
    color:#123240;

    font-size:58px;
    font-weight:800;

    margin-bottom:10px;
}

.hx-content p{
    color:#4f5965;

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

    margin-bottom:40px;
}

/* =========================================
SEARCH BOX
========================================= */

.hx-search-box{
    width:100%;
    max-width:960px;

    margin:auto;

    background:rgba(255,253,250,0.92);

    border:1px solid #d9d1c5;

    border-radius:16px;

    padding:18px;

    box-shadow:
    0 24px 60px rgba(31,34,38,0.12);
}

/* TABS */

.hx-tabs{
    display:flex;
    gap:36px;

    margin-bottom:18px;

    padding-left:6px;
}

.hx-tabs button{
    border:none;
    background:none;

    color:#7f8893;

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

    cursor:pointer;

    padding-bottom:10px;

    position:relative;
}

.hx-tabs button.active{
    color:#123240;
}

.hx-tabs button.active::after{
    content:'';

    position:absolute;

    left:0;
    bottom:0;

    width:100%;
    height:3px;

    background:#123240;

    border-radius:10px;
}

/* SEARCH */

.hx-search-row{
    display:flex;
    align-items:center;

    background:#fff;

    border:1px solid #d9d1c5;

    border-radius:14px;

    overflow:hidden;
}

.hx-search-input{
    position:relative;
    flex:1;
}

.hx-search-input i{
    position:absolute;

    left:22px;
    top:50%;

    transform:translateY(-50%);

    color:#777;
}

.hx-search-input input{
    width:100%;
    height:64px;

    border:none;
    outline:none;

    padding:0 22px 0 56px;

    font-size:16px;
}

.hx-search-btn{
    width:150px;
    height:64px;

    border:none;

    background:#123240;

    color:#fff;

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

    cursor:pointer;

    transition:0.3s;
}

.hx-search-btn:hover{
    background:#0f3d46;
}

/* POPULAR */

.hx-popular{
    margin-top:20px;

    display:flex;
    align-items:center;
    gap:14px;

    flex-wrap:wrap;
}

.hx-popular-title{
    display:flex;
    align-items:center;
    gap:8px;

    color:#1f2226;

    font-size:15px;
    font-weight:600;
}

.hx-popular-list{
    display:flex;
    align-items:center;
    gap:10px;

    flex-wrap:wrap;
}

.hx-popular-list button{
    border:1px solid #d9d1c5;

    background:rgba(31,34,38,0.04);

    color:#1f2226;

    padding:10px 18px;

    border-radius:10px;

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

    cursor:pointer;

    transition:0.3s;
}

.hx-popular-list button:hover{
    background:#123240;
    color:#fff;
    border-color:#123240;
}

/* =========================================
IMAGE
========================================= */

.hx-image{
    position:absolute;

    right:40px;
    top:90px;

    width:340px;
    height:430px;

    border-radius:36px;

    overflow:hidden;

    transform:rotate(-6deg);

    border:
    5px solid rgba(255,255,255,0.18);

    box-shadow:
    0 30px 60px rgba(0,0,0,0.30);
	Display:none;
}

.hx-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* =========================================
RESPONSIVE
========================================= */

@media(max-width:1100px){

    .hx-menu{
        gap:16px;
    }

    .hx-image{
        display:none;
    }

}

@media(max-width:900px){

    .hx-mobile-btn{
        display:flex;
        align-items:center;
        justify-content:center;
    }

    .hx-menu{
        position:absolute;

        top:72px;
        left:0;

        width:100%;

        background:radial-gradient(circle at 8% -4%, #fff 0%, var(--sand) 38%, #ebe3d7 100%);

        flex-direction:column;

        align-items:flex-start;

        gap:0;

        padding:20px;

        display:none;
    }

    .hx-menu.show{
        display:flex;
    }

    .hx-menu a{
        width:100%;

        padding:14px 0;

        border-bottom:
        1px solid rgba(255,255,255,0.08);
    }

    .hx-right{
        display:none;
    }

}

@media(max-width:768px){

    .hx-hero{
        height:auto !important;
        padding-bottom:50px;
    }

    .hx-content{
        padding:60px 20px 0;
    }

    .hx-content h1{
        font-size:36px;
        line-height:1.3;
    }

    .hx-content p{
        font-size:16px;
    }

    .hx-search-row{
        flex-direction:column;
    }

    .hx-search-btn{
        width:100%;
    }

    .hx-tabs{
        overflow:auto;
        white-space:nowrap;
    }

    .hx-popular{
        justify-content:center;
    }

}





/* =========================================
TOP PICKS SECTION
========================================= */

.htp-section{
    width:100%;

    padding:50px 18px;

    background:#f5f5f5;
}

/* =========================================
TOP AREA
========================================= */

.htp-top{
    max-width:1180px;

    margin:auto;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:20px;

    margin-bottom:24px;
}

.htp-top h2{
    font-size:38px;
    font-weight:800;

    color:#333;

    margin-bottom:6px;
}

.htp-top p{
    color:#777;

    font-size:18px;
}

/* =========================================
TABS
========================================= */

.htp-tabs{
    display:flex;
    align-items:center;

    gap:14px;
}

.htp-tab{
    width:150px;

    cursor:pointer;
}

.htp-tab img{
    width:100%;
    height:84px;

    object-fit:cover;

    border-radius:12px;

    border:2px solid transparent;

    transition:0.3s;
}

.htp-tab span{
    display:block;

    margin-top:6px;

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

    color:#555;

    text-align:center;
}

.htp-tab.active img{
    border-color:#7b4dff;
}

/* =========================================
MAIN SECTION
========================================= */

.htp-main{
    max-width:1180px;

    margin:auto;

    display:grid;

    grid-template-columns:
    280px
    1fr;

    gap:18px;

    align-items:stretch;
}

/* =========================================
LEFT INFO
========================================= */

.htp-info{
    background:
    linear-gradient(
        180deg,
        #efdfff,
        #efcfcf
    );

    border-radius:22px;

    padding:22px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;

    height:100%;
    min-height:380px;
}

/* COMPANY */

.htp-company{
    display:flex;
    align-items:center;

    gap:14px;
}

.htp-company img{
    width:60px;
    height:60px;

    object-fit:contain;

    border-radius:14px;

    background:#fff;

    padding:8px;
}

.htp-company h4{
    font-size:24px;
    font-weight:700;

    color:#222;

    margin-bottom:4px;
}

.htp-company a{
    color:#6a35ff;

    font-size:14px;
    font-weight:600;
}

/* DETAILS */

.htp-details{
    margin-top:26px;
}

.htp-details h3{
    font-size:20px;
    font-weight:700;

    color:#111;

    margin-bottom:6px;
}

.htp-details span{
    display:block;

    color:#555;

    font-size:15px;

    margin-bottom:22px;
}

.htp-price{
    font-size:25px;
    font-weight:800;

    color:#111;

    margin-bottom:8px;
}

.htp-details p{
    color:#444;

    font-size:16px;
}

/* BUTTON */

.htp-btn{
    width:100%;
    height:54px;

    border:none;

    border-radius:14px;

    background:#6a35ff;

    color:#fff;

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

    cursor:pointer;

    margin-top:30px;

    transition:0.3s;
}

.htp-btn:hover{
    background:#5426ef;
}

/* =========================================
IMAGE
========================================= */

.htp-image{
    position:relative;

    border-radius:22px;

    overflow:hidden;

    height:380px;
}

.htp-image img{
    width:100%;
    height:100%;

    object-fit:cover;
}

/* PAUSE BUTTON */

.htp-pause{
    position:absolute;

    top:18px;
    right:18px;

    width:52px;
    height:52px;

    border:none;

    border-radius:50%;

    background:#fff;

    color:#111;

    font-size:20px;

    cursor:pointer;
}

/* =========================================
RESPONSIVE
========================================= */

@media(max-width:1000px){

    .htp-main{
        grid-template-columns:1fr;
    }

}

@media(max-width:768px){

    .htp-top{
        flex-direction:column;
    }

    .htp-tabs{
        width:100%;

        overflow:auto;

        padding-bottom:6px;
    }

    .htp-top h2{
        font-size:28px;
    }

    .htp-top p{
        font-size:15px;
    }

    .htp-main{
        grid-template-columns:1fr;
    }

    .htp-info{
        order:2;

        min-height:auto;
    }

    .htp-image{
        height:260px;
    }

    .htp-company h4{
        font-size:20px;
    }

    .htp-details h3{
        font-size:26px;
    }

    .htp-price{
        font-size:26px;
    }

}




/* =========================================
TOP HIGHLIGHTED PROJECTS
FINAL CSS
========================================= */

.hp-project-section{
    width:100%;

    padding:50px 20px;

    background:#f5f5f5;
}

/* =========================================
TOP
========================================= */

.hp-project-top{
    max-width:1100px;
    margin:auto;

    margin-bottom:24px;
}

.hp-project-top h2{
    font-size:38px;
    font-weight:800;

    color:#333;

    margin-bottom:6px;
}

.hp-project-top p{
    color:#777;

    font-size:18px;
}

/* =========================================
WRAPPER
========================================= */

.hp-project-wrapper{
    position:relative;

    max-width:1100px;

    margin:auto;
}

/* =========================================
GRID
========================================= */

.hp-project-grid{
    display:grid;
    grid-template-columns:1fr 1fr;

    gap:18px;
}

/* =========================================
CARD
========================================= */

.hp-project-card{
    position:relative;

    height:250px;

    border-radius:16px;

    overflow:hidden;

    cursor:pointer;

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

.hp-project-card img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;
}

.hp-project-card:hover img{
    transform:scale(1.06);
}

/* =========================================
OVERLAY
========================================= */

.hp-overlay{
    position:absolute;

    inset:0;

    background:
    linear-gradient(
        180deg,
        rgba(0,0,0,0.05),
        rgba(0,0,0,0.78)
    );
}

/* =========================================
CONTENT
========================================= */

.hp-content{
    position:absolute;

    left:18px;
    right:18px;
    bottom:18px;

    color:#fff;

    z-index:2;
}

.hp-content h3{
    font-size:24px;
    font-weight:700;

    margin-bottom:4px;
}

.hp-content span{
    font-size:14px;
    font-weight:500;

    opacity:0.9;
}

/* =========================================
BOTTOM
========================================= */

.hp-bottom{
    margin-top:14px;

    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:10px;
}

.hp-bottom p{
    font-size:15px;
    font-weight:600;

    margin-bottom:3px;
}

.hp-bottom small{
    font-size:13px;

    opacity:0.9;
}

.hp-bottom strong{
    font-size:24px;
    font-weight:800;

    white-space:nowrap;
}

/* =========================================
ARROWS
========================================= */

.hp-arrow{
    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:54px;
    height:54px;

    border:none;

    border-radius:50%;

    background:#fff;

    color:#444;

    font-size:18px;

    cursor:pointer;

    z-index:5;

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

    transition:0.3s;
}

.hp-arrow:hover{
    background:#4320c2;
    color:#fff;
}

.hp-prev{
    left:-26px;
}

.hp-next{
    right:-26px;
}

/* =========================================
TABLET
========================================= */

@media(max-width:900px){

    .hp-project-grid{
        grid-template-columns:1fr;
    }

    .hp-project-top h2{
        font-size:30px;
    }

    .hp-project-top p{
        font-size:16px;
    }

    .hp-project-card{
        height:240px;
    }

    .hp-content h3{
        font-size:22px;
    }

    .hp-bottom{
        flex-direction:column;
        align-items:flex-start;
    }

    .hp-bottom strong{
        font-size:22px;
    }

}

/* =========================================
MOBILE
========================================= */

@media(max-width:600px){

    .hp-project-section{
        padding:40px 16px;
    }

    .hp-project-card{
        height:220px;
    }

    .hp-project-top h2{
        font-size:26px;
    }

    .hp-project-top p{
        font-size:15px;
    }

    .hp-content{
        left:14px;
        right:14px;
        bottom:14px;
    }

    .hp-content h3{
        font-size:20px;
    }

    .hp-content span{
        font-size:13px;
    }

    .hp-bottom p{
        font-size:14px;
    }

    .hp-bottom small{
        font-size:12px;
    }

    .hp-bottom strong{
        font-size:20px;
    }

    .hp-arrow{
        display:none;
    }

}



/* =========================================
MODERN TRUSTED DEVELOPERS
PREMIUM COMPACT DESIGN
========================================= */

.td-project-section{
    width:100%;

    padding:55px 18px;

    background:#f7f8fc;
}

/* =========================================
TOP SECTION
========================================= */

.td-project-top{
    max-width:1180px;
    margin:auto;

    margin-bottom:26px;
}

.td-project-top h2{
    font-size:32px;
    font-weight:700;

    color:#222;

    margin-bottom:6px;
}

.td-project-top p{
    color:#777;

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

/* =========================================
GRID
========================================= */

.td-project-grid{
    max-width:1180px;

    margin:auto;

    display:grid;

    grid-template-columns:
    repeat(3,1fr);

    gap:18px;
}

/* =========================================
CARD
========================================= */

.td-card{
    background:#fff;

    border-radius:18px;

    overflow:hidden;

    border:
    1px solid #ececec;

    transition:0.3s;

    cursor:pointer;
}

.td-card:hover{
    transform:translateY(-5px);

    box-shadow:
    0 12px 30px rgba(0,0,0,0.08);
}

/* =========================================
IMAGE
========================================= */

.td-image{
    width:100%;
    height:190px;

    overflow:hidden;
}

.td-image img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;
}

.td-card:hover .td-image img{
    transform:scale(1.05);
}

/* =========================================
CONTENT
========================================= */

.td-content{
    padding:16px;
}

.td-content h3{
    font-size:22px;
    font-weight:700;

    color:#222;

    line-height:1.4;

    margin-bottom:3px;
}

.td-builder{
    display:block;

    color:#777;

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

    margin-bottom:14px;
}

/* PROPERTY INFO */

.td-info{
    color:#444;

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

    margin-bottom:3px;
}

.td-location{
    color:#888;

    font-size:13px;

    margin-bottom:16px;
}

/* PRICE */

.td-price{
    display:inline-block;

    background:#f3f1ff;

    color:#4320c2;

    padding:10px 14px;

    border-radius:10px;

    font-size:18px;
    font-weight:700;
}

/* =========================================
VIEW BUTTON
========================================= */

.td-view-wrap{
    text-align:center;

    margin-top:34px;
}

.td-view-btn{
    height:50px;

    padding:0 28px;

    border:none;

    border-radius:12px;

    background:#4320c2;

    color:#fff;

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

    cursor:pointer;

    transition:0.3s;
}

.td-view-btn:hover{
    background:#2f1692;
}

/* =========================================
TABLET
========================================= */

@media(max-width:1000px){

    .td-project-grid{
        grid-template-columns:
        repeat(2,1fr);
    }

}

/* =========================================
MOBILE
========================================= */

@media(max-width:700px){

    .td-project-section{
        padding:40px 14px;
    }

    .td-project-grid{
        grid-template-columns:1fr;
    }

    .td-project-top h2{
        font-size:26px;
    }

    .td-project-top p{
        font-size:14px;
    }

    .td-image{
        height:180px;
    }

    .td-content h3{
        font-size:19px;
    }

    .td-price{
        font-size:16px;
    }

}



/* =========================================
NEWS & ARTICLES
========================================= */

.na-section{
    position:relative;

    width:100%;

    padding:55px 20px;

    background:#f5f5f5;
}

/* =========================================
TOP
========================================= */

.na-top{
    max-width:1180px;

    margin:auto;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:20px;

    margin-bottom:30px;
}

.na-top h2{
    font-size:42px;
    font-weight:800;

    color:#333;

    margin-bottom:6px;
}

.na-top p{
    color:#777;

    font-size:18px;
}

/* BUTTON */

.na-view-btn{
    display:flex;
    align-items:center;

    gap:8px;

    height:48px;

    padding:0 22px;

    border:
    1px solid #6a35ff;

    border-radius:10px;

    color:#6a35ff;

    text-decoration:none;

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

    transition:0.3s;
}

.na-view-btn:hover{
    background:#6a35ff;
    color:#fff;
}

/* =========================================
GRID
========================================= */

.na-grid{
    max-width:1180px;

    margin:auto;

    display:grid;

    grid-template-columns:
    repeat(3,1fr);

    gap:20px;
}

/* =========================================
CARD
========================================= */

.na-card{
    background:#fff;

    border-radius:14px;

    overflow:hidden;

    transition:0.3s;

    border:
    1px solid #ececec;
}

.na-card:hover{
    transform:translateY(-5px);

    box-shadow:
    0 12px 30px rgba(0,0,0,0.08);
}

/* IMAGE */

.na-image{
    width:100%;
    height:210px;

    overflow:hidden;
}

.na-image img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;
}

.na-card:hover .na-image img{
    transform:scale(1.05);
}

/* CONTENT */

.na-content{
    padding:18px 18px 14px;
}

.na-content h3{
    font-size:18px;
    font-weight:700;

    line-height:1.5;

    color:#222;

    margin-bottom:14px;
}

.na-content p{
    color:#777;

    font-size:14px;
    line-height:1.7;
}

/* FOOTER */

.na-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:14px 18px;

    border-top:
    1px solid #ececec;
}

.na-footer span{
    color:#555;

    font-size:13px;
    font-weight:500;
}

.na-footer small{
    color:#888;

    font-size:13px;
}

/* FLOAT BUTTON */

.na-arrow{
    position:absolute;

    right:140px;
    top:50%;

    transform:translateY(-50%);

    width:58px;
    height:58px;

    border:none;

    border-radius:50%;

    background:#fff;

    color:#444;

    font-size:18px;

    cursor:pointer;

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

    transition:0.3s;
}

.na-arrow:hover{
    background:#6a35ff;
    color:#fff;
}

/* =========================================
TABLET
========================================= */

@media(max-width:1000px){

    .na-grid{
        grid-template-columns:
        repeat(2,1fr);
    }

}

/* =========================================
MOBILE
========================================= */

@media(max-width:700px){

    .na-section{
        padding:45px 14px;
    }

    .na-top{
        flex-direction:column;
    }

    .na-grid{
        grid-template-columns:1fr;
    }

    .na-top h2{
        font-size:30px;
    }

    .na-top p{
        font-size:15px;
    }

    .na-content h3{
        font-size:17px;
    }

    .na-arrow{
        display:none;
    }

}




/* =========================================
PREMIUM FOOTER
========================================= */

.ap-footer{
    background:#111827;

    color:#fff;

    padding-top:60px;
}

/* CONTAINER */

.ap-footer-container{
    max-width:1180px;

    margin:auto;

    padding:0 20px 50px;

    display:grid;

    grid-template-columns:
    1.3fr
    0.8fr
    1fr;

    gap:50px;
}

/* =========================================
ABOUT
========================================= */

.ap-footer-logo{
    height:58px;

    margin-bottom:22px;
}

.ap-footer-about p{
    color:#c7c7c7;

    font-size:15px;
    line-height:1.9;

    margin-bottom:28px;
}

/* SOCIAL */

.ap-footer-social{
    display:flex;
    align-items:center;

    gap:12px;
}

.ap-footer-social a{
    width:42px;
    height:42px;

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

    border-radius:12px;

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

    color:#fff;

    text-decoration:none;

    font-size:15px;

    transition:0.3s;
}

.ap-footer-social a:hover{
    background:#6a35ff;

    transform:translateY(-3px);
}

/* =========================================
LINKS
========================================= */

.ap-footer-links h3,
.ap-footer-contact h3{
    font-size:22px;
    font-weight:700;

    margin-bottom:24px;
}

.ap-footer-links{
    display:flex;
    flex-direction:column;
}

.ap-footer-links a{
    color:#c7c7c7;

    text-decoration:none;

    font-size:15px;

    margin-bottom:16px;

    transition:0.3s;
}

.ap-footer-links a:hover{
    color:#fff;

    padding-left:6px;
}

/* =========================================
CONTACT
========================================= */

.ap-contact-item{
    display:flex;
    align-items:flex-start;

    gap:14px;

    margin-bottom:20px;
}

.ap-contact-item i{
    color:#8b5cf6;

    font-size:18px;

    margin-top:4px;
}

.ap-contact-item span{
    color:#d1d5db;

    font-size:15px;
    line-height:1.8;
}

/* BUTTON */

.ap-footer-btn{
    height:50px;

    padding:0 28px;

    border:none;

    border-radius:14px;

    background:#6a35ff;

    color:#fff;

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

    cursor:pointer;

    margin-top:10px;

    transition:0.3s;
}

.ap-footer-btn:hover{
    background:#5426ef;
}

/* =========================================
BOTTOM
========================================= */

.ap-footer-bottom{
    border-top:
    1px solid rgba(255,255,255,0.08);

    text-align:center;

    padding:22px 20px;

    color:#9ca3af;

    font-size:14px;
}

/* =========================================
RESPONSIVE
========================================= */

@media(max-width:900px){

    .ap-footer-container{
        grid-template-columns:1fr 1fr;
    }

}

@media(max-width:700px){

    .ap-footer{
        padding-top:45px;
    }

    .ap-footer-container{
        grid-template-columns:1fr;

        gap:35px;
    }

    .ap-footer-logo{
        height:50px;
    }

    .ap-footer-links h3,
    .ap-footer-contact h3{
        font-size:20px;
    }

    .ap-footer-about p,
    .ap-footer-links a,
    .ap-contact-item span{
        font-size:14px;
    }

}



/* =========================================
ABOUT HERO
========================================= */

.au-hero{
    position:relative;

    width:100%;

    padding: 0 0 50px 0;

    background:
    linear-gradient(
        135deg,
        rgba(245,230,200,0.92),
        rgba(255,244,220,0.88)
    ),
    url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=2070');

    background-size:cover;
    background-position:center;

    overflow:hidden;
}

.au-hero-content{
    max-width:1180px;

    margin:auto;

    text-align:center;

    color:#1f2226;
}

.au-tag{
    display:inline-block;

    background:
    rgba(31,34,38,0.08);

    padding:10px 18px;

    border-radius:999px;

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

    letter-spacing:0.08em;

    margin-bottom:22px;

	margin-top: 50px;
}

.au-hero h1{
    font-size:64px;
    font-weight:800;
    margin-bottom:18px;
	margin-top: 50px;
    color:#123240;
}

.au-hero p{
    max-width:780px;

    margin:auto;

    font-size:19px;
    line-height:1.9;

    color:#4f5965;
}

/* =========================================
ABOUT SECTION
========================================= */

.au-section{
    width:100%;

    padding:80px 20px;
}

.au-container{
    max-width:1180px;

    margin:auto;

    display:grid;

    grid-template-columns:
    1.1fr
    0.9fr;

    gap:60px;
}

/* =========================================
LEFT CONTENT
========================================= */

.au-left h2{
    font-size:44px;
    font-weight:800;

    color:#222;

    margin-bottom:18px;
}

.au-left p{
    color:#555;

    font-size:16px;
    line-height:2;

    margin-bottom:24px;
}

/* =========================================
FEATURE BOXES
========================================= */

.au-features{
    display:grid;

    grid-template-columns:
    repeat(2,1fr);

    gap:18px;

    margin-top:34px;
}

.au-feature{
    background:#fff;

    border-radius:20px;

    padding:24px;

    border:
    1px solid #ececec;

    transition:0.3s;
}

.au-feature:hover{
    transform:translateY(-5px);

    box-shadow:
    0 12px 28px rgba(0,0,0,0.08);
}

.au-icon{
    width:58px;
    height:58px;

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

    border-radius:16px;

    background:#f3efff;

    color:#6a35ff;

    font-size:22px;

    margin-bottom:18px;
}

.au-feature h3{
    font-size:20px;
    font-weight:700;

    margin-bottom:10px;
}

.au-feature p{
    font-size:14px;
    line-height:1.8;

    color:#666;

    margin:0;
}

/* =========================================
RIGHT SIDE
========================================= */

.au-right{
    position:relative;
}

/* IMAGE */

.au-image{
    position:relative;

    border-radius:28px;

    overflow:hidden;

    height:540px;

    box-shadow:
    0 20px 50px rgba(0,0,0,0.15);
}

.au-image img{
    width:100%;
    height:100%;

    object-fit:cover;
}

/* CONTACT CARD */

.au-contact-card{
    position:absolute;

    left:-40px;
    bottom:40px;

    width:320px;

    background:#fff;

    border-radius:24px;

    padding:28px;

    box-shadow:
    0 18px 40px rgba(0,0,0,0.12);
}

.au-contact-card h3{
    font-size:24px;
    font-weight:700;

    margin-bottom:20px;
}

/* CONTACT ITEM */

.au-contact-item{
    display:flex;
    align-items:flex-start;

    gap:14px;

    margin-bottom:18px;
}

.au-contact-item i{
    width:42px;
    height:42px;

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

    border-radius:12px;

    background:#f3efff;

    color:#6a35ff;

    font-size:16px;
}

.au-contact-item span{
    color:#555;

    font-size:14px;
    line-height:1.8;
}

/* BUTTON */

.au-btn{
    width:100%;
    height:54px;

    border:none;

    border-radius:14px;

    background:#6a35ff;

    color:#fff;

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

    cursor:pointer;

    margin-top:10px;

    transition:0.3s;
}

.au-btn:hover{
    background:#5426ef;
}

/* =========================================
WHY CHOOSE
========================================= */

.au-why{
    width:100%;

    padding:20px 20px 90px;
}

.au-why-container{
    max-width:1180px;

    margin:auto;
}

.au-why-title{
    text-align:center;

    margin-bottom:50px;
}

.au-why-title h2{
    font-size:44px;
    font-weight:800;

    margin-bottom:12px;
}

.au-why-title p{
    color:#666;

    font-size:17px;
}

/* GRID */

.au-why-grid{
    display:grid;

    grid-template-columns:
    repeat(3,1fr);

    gap:24px;
}

/* CARD */

.au-why-card{
    background:#fff;

    border-radius:24px;

    padding:34px;

    text-align:center;

    border:
    1px solid #ececec;

    transition:0.3s;
}

.au-why-card:hover{
    transform:translateY(-8px);

    box-shadow:
    0 14px 34px rgba(0,0,0,0.08);
}

.au-why-icon{
    width:72px;
    height:72px;

    margin:auto;

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

    border-radius:18px;

    background:#f3efff;

    color:#6a35ff;

    font-size:28px;

    margin-bottom:24px;
}

.au-why-card h3{
    font-size:22px;
    font-weight:700;

    margin-bottom:14px;
}

.au-why-card p{
    color:#666;

    font-size:15px;
    line-height:1.9;
}

/* =========================================
RESPONSIVE
========================================= */

@media(max-width:1000px){

    .au-container{
        grid-template-columns:1fr;
    }

    .au-contact-card{
        position:relative;

        left:0;
        bottom:0;

        width:100%;

        margin-top:24px;
    }

    .au-why-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:700px){

    .au-hero{
        padding:90px 16px 70px;
    }

    .au-hero h1{
        font-size:42px;
    }

    .au-hero p{
        font-size:16px;
    }

    .au-section{
        padding:55px 16px;
    }

    .au-left h2{
        font-size:32px;
    }

    .au-features{
        grid-template-columns:1fr;
    }

    .au-image{
        height:380px;
    }

    .au-why-title h2{
        font-size:32px;
    }

}


/* =========================================
CONTACT HERO
========================================= */

.contact-hero{
    width:100%;

    padding:90px 20px;

    background:
    linear-gradient(
        rgba(76,37,224,0.90),
        rgba(76,37,224,0.90)
    ),
    url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=2070');

    background-size:cover;
    background-position:center;

    text-align:center;

    color:#fff;
}

.contact-hero h1{
    font-size:56px;
    font-weight:800;

    margin-bottom:16px;
}

.contact-hero p{
    font-size:18px;

    color:#ece7ff;
}

/* =========================================
CONTACT SECTION
========================================= */

.contact-section{
    width:100%;

    padding:70px 20px;
}

.contact-container{
    max-width:1180px;

    margin:auto;

    display:grid;

    grid-template-columns:
    1.2fr
    0.8fr;

    gap:30px;
}

/* =========================================
FORM BOX
========================================= */

.contact-form-box{
    background:#fff;

    border-radius:24px;

    padding:40px;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.05);
}

.contact-form-box h2{
    font-size:34px;
    font-weight:800;

    margin-bottom:10px;
}

.contact-form-box p{
    color:#666;

    margin-bottom:35px;
}

/* FORM GROUP */

.form-group{
    margin-bottom:24px;
}

.form-group label{
    display:block;

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

    margin-bottom:10px;

    color:#222;
}

.form-group input,
.form-group textarea{
    width:100%;

    border:
    1px solid #ddd;

    border-radius:14px;

    padding:16px 18px;

    font-size:15px;

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

    outline:none;

    transition:0.3s;
}

.form-group input:focus,
.form-group textarea:focus{
    border-color:#6a35ff;

    box-shadow:
    0 0 0 4px rgba(106,53,255,0.08);
}

.form-group textarea{
    height:160px;

    resize:none;
}

/* BUTTON */

.contact-btn{
    width:100%;
    height:58px;

    border:none;

    border-radius:16px;

    background:#6a35ff;

    color:#fff;

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

    cursor:pointer;

    transition:0.3s;
}

.contact-btn:hover{
    background:#5426ef;
}

/* =========================================
RIGHT SIDE
========================================= */

.contact-right{
    display:flex;
    flex-direction:column;

    gap:24px;
}

/* INFO CARD */

.contact-info{
    background:#fff;

    border-radius:24px;

    padding:34px;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.05);
}

/* ITEM */

.contact-item{
    display:flex;
    align-items:flex-start;

    gap:14px;

    margin-bottom:24px;
}

.contact-item:last-child{
    margin-bottom:0;
}

.contact-item i{
    width:48px;
    height:48px;

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

    border-radius:14px;

    background:#f3efff;

    color:#6a35ff;

    font-size:18px;
}

.contact-item span{
    color:#444;

    line-height:1.8;
}

/* MAP */

.contact-map{
    overflow:hidden;

    border-radius:24px;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.05);
}

.contact-map iframe{
    width:100%;
    height:420px;

    border:none;
}


/* =========================================
IMAGE
========================================= */

.td-image{
    position:relative;

    width:100%;
    height:220px;

    overflow:hidden;

    border-radius:18px 18px 0 0;
}

.td-image img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:0.4s;
}

.td-card:hover .td-image img{
    transform:scale(1.05);
}

/* =========================================
PROPERTY NUMBER
========================================= */

.td-propno{
    position:absolute;

    top:14px;
    left:14px;

    z-index:2;

    background:
    rgba(0,0,0,0.75);

    color:#fff;

    padding:7px 14px;

    border-radius:30px;

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

    backdrop-filter:blur(6px);
}

/* =========================================
SALE / RENT TAG
========================================= */

.td-tag{
    position:absolute;

    top:14px;
    right:14px;

    z-index:2;

    padding:7px 16px;

    border-radius:30px;

    color:#fff;

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

    text-transform:uppercase;

    letter-spacing:0.5px;

    backdrop-filter:blur(6px);
}

/* SALE */

.td-tag.sale{
    background:#00a63e;
}

/* RENT */

.td-tag.rent{
    background:#6a35ff;
}

/* =========================================
CARD
========================================= */

.td-card{
    background:#fff;

    border-radius:18px;

    overflow:hidden;

    box-shadow:
    0 8px 24px rgba(0,0,0,0.06);

    transition:0.3s;
}

.td-card:hover{
    transform:translateY(-6px);

    box-shadow:
    0 16px 40px rgba(0,0,0,0.10);
}


/* =========================================
CARD LINK
========================================= */

.td-card-link{
    text-decoration:none;

    color:inherit;

    display:block;
}

/* =========================================
VIEW BUTTON LINK
========================================= */

.td-view-btn{
    display:inline-flex;

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

    min-width:220px;

    height:54px;

    padding:0 28px;

    border-radius:16px;

    background:#6a35ff;

    color:#fff;

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

    text-decoration:none;

    transition:0.3s;
}

.td-view-btn:hover{
    background:#5426ef;

    transform:translateY(-3px);
}

/* =========================================
SITE-WIDE OVERRIDES — keep hero typography
consistent with the home page (Syne, not the
Playfair Display set by theme.css .hero h1).
========================================= */
.hero h1{
    font-family:'Syne', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-weight:800;
    color:#123240;
}

.hero h1 em{
    font-style:normal;
    font-weight:800;
    color:#d26a2d;
}

.hero .eyebrow{
    color:#4f5965;
}

.hero p.lead{
    color:#4f5965;
}