/*!
Theme Name: dubaisky
Theme URI: https://deolproperties.com/
Author: Underscores.me
Author URI: https://deolproperties.com/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: dubaisky
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* Font Lato & Urbanist */
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --thm-color-1: #DAAA44;
    --font-color-menu: rgba(0, 0, 0, 0.7);
    --color-black: #000000;
    --color-white: #ffffff;
    --color-purple: #481567;
    --font-body: "Lato", sans-serif;
    --font-heading: "Urbanist", sans-serif; 
}
body{
    font-family: var(--font-body);
}
.container{
    max-width:1412px;
} 
p{
    margin-bottom: 0;
}

.topheader{
    background-color: var(--thm-color-1);
    color: var(--color-white);
    padding: 8px 0;
}
.th-icon:not(:last-child) {
    margin-right: 20px;
}
.topemail::before {
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/email.svg");
}
.topphn::before {
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/phone.svg");
}
.topemail::before,
.topphn::before{
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: auto;
    margin-right: 8px; /* default spacing */
}
.topheader a{
    color: var(--color-white);
    font-size: 16px;
    line-height: 20px;
    font-family: var(--font-body);
    font-weight: 400;
    text-decoration: none;
}

.top-btn {
    color: var(--color-white);
    border: 1px solid white;
    border-radius: 45px;
    font-size: 15px;
    line-height:20px;
    font-family: var(--font-body);
}
.top-setting-btn::before{
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/settings.svg");
}

.top-btn::before{
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: auto;
    margin-right: 3px; /* default spacing */
}
.top-btn.dropdown-toggle::after {
  display: none !important;
}

.top-btn.btn:hover{
    border-color:inherit;
}
.header-nav {
    padding: 5px 0;
}
.custom-logo {
    width: 80px;
    height: auto;
} 
.nav-link {
    font-size: 18px;
    line-height: 20px;
    font-family: var(--font-body);
    font-weight: 600;
    color: var(--font-color-menu);
}
.nav-item:not(:last-child) {
    margin-right: 15px;
}

.rightouter {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.topbuttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.topsocialbtns a {
    background: #ffffff;
    padding: 8px 10px;
    border-radius: 50%;
    line-height: 1;
}
/* .topsocialbtns a:not(:last-child) {
    margin-right: 10px;
    } */
.topsocialbtns {
    display: flex;
    column-gap: 15px;
}
.topsocialbtns img {
width: 15px;
vertical-align: middle;
}
.topbuttons .btns:not(:last-child) {
    margin-right: 17px;
}
/* .topbuttons .btns .form-select{
    --bs-form-select-bg-img: url('https://deolproperties.com/wp-content/uploads/2025/09/dropdown.svg') !important; 
} */

.top-location-btn, .top-location-btn:hover{
    color: var(--color-black);
    border: 1px solid #ffffff;
    border-radius: 45px;
    font-size: 15px;
    line-height: 20px;
    font-family: var(--font-body);
    background-color: var(--color-white);
}
.select-wrapper {
  position: relative;
  display: inline-block;
}

.select-wrapper .select-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: auto;
  pointer-events: none; /* allows click on select */
}

.top-lang-btn {
  padding-left: 35px;
  padding-right: 35px;
}

/* End of Header CSS */

/* Footer CSS */
.site-footer .footermain{
    background-color: var(--color-purple);
    color: var(--color-white);
    padding: 25px 0;
}
.footer-logo img {
    width: 150px;
}
.footercontact {
    margin-top: 25px;
}
.footer-list-cont, .footer-menu, .footer-menu-bottom, .footercopyright {
  list-style: none;
  padding: 0; 
  margin: 0;
}

.footer-list-cont li:not(:last-child) {
    margin-bottom: 15px;
}
.footer-list-cont li a, .footer-menu li a {
    color: var(--color-white);
    text-decoration: none;
    font-size: 18px;
    line-height: 22.5px;
    font-weight: 400;
    font-family: var(--font-heading);
}
.footer-email::before{
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/mail.svg");
}
.footer-whatsapp::before{
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/whatsapp-footer.svg");
}
.footer-telfooter-tel::before{
    content: url("https://deolproperties.com/wp-content/uploads/2025/09/communication-footer.svg");
}

.footer-email::before, .footer-whatsapp::before, .footer-telfooter-tel::before{
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: auto;
    margin-right: 15px;
}

.footer-menu li:not(:last-child){
    margin-bottom:30px;
}
.footermain h2{
    color: var(--color-white);
    font-size: 21px;
    line-height: 23px;
    font-family: var(--font-heading);
    margin-bottom: 30px;
}
.btn-footer-subs, .btn-footer-subs:hover{
    color: var(--color-white);
    border: 2px solid white;
    border-radius: 45px;
    font-size: 18px;
    line-height:24px;
    font-family: var(--font-body);
    padding: 10px 34px;
    font-weight: 600;
}
.footeremail {
    border-radius: 45px;
    padding: 10px 20px;
    font-size: 15px;
    line-height: 24px;
    font-weight: 400;
}
.footer-subscription {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    justify-content: space-between;
}
.sub-content p{
    font-size: 16px;
    line-height: 21px;
    font-weight: 400;
    margin-bottom: 0;
}
.footersocial{
    display: flex;
    column-gap: 15px;
}
.footersocial a{
    background: #ffffff;
    line-height: 1;
    padding: 8px 10px;
    border-radius: 50%;;
}
.footersocial img{
    width:17px;
    height:auto;
}
.form-control:focus{
    border-color: unset;
    box-shadow: unset;
}
.footer-menu-bottom, .footercopyright{
    display: flex;
    column-gap: 40px;
}
.footer-menu-bottom li a, .footercopyright li {
    color: var(--thm-color-1);
    text-decoration: none;
    font-size: 18px;
    line-height: 20px;
    font-weight: 600;
}

/* End of Footer CSS */

/* Home Page CSS */
.homebanner {
  background: url("https://deolproperties.com/wp-content/uploads/2025/09/homebanner-bg-scaled.webp") no-repeat center center;
  background-size: cover; 
  position: relative;
  padding: 60px 20px;
  min-height: 400px; 
}

.homebnroutr {
  position: relative;
  z-index: 2; 
  color: var(--color-white); 
  text-align: center; 
}

.homebanner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.06);
  z-index: 1;
}
.homebnroutr {
    display: flex;
    flex-direction: column;
    row-gap: 25px;
    width: 80%;
    align-items: center;
    margin: auto;
    padding: 8px 0;
}
.homebanner h1{
    font-size: 68px;
    line-height: 73px;
    text-transform: capitalize;
    font-weight: 700;
    font-family: var(--font-heading);
}
ul.industrylisting {
    list-style: none;
    display: flex;
    column-gap: 10px;
    align-items: center;
    justify-content: center;
    margin-bottom:0;
}
.hbreview {
    display: flex;
    align-items: center;
    column-gap: 10px;
    justify-content: center;
}
.hbreview .rating {
    line-height: 1px;
}
.hbreview .rating img {
    width: 20px;
}
.hbreview p{
    font-size: 18px;
    line-height: 18px;
}
.industrylisting li::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  vertical-align: middle;
  background-size: contain;  /* keeps aspect ratio */
  background-repeat: no-repeat;
  background-position: center;
}
.industrylisting .home::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/1.home_.svg");
}
.industrylisting .villas::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/2.villas.svg");
}
.industrylisting .towns::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/3.towns_.svg");
}
.industrylisting .apartments::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/4.appointments.svg");
}
.industrylisting .industrial::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/5.industry.svg");
}
.industrylisting .multifamily::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/6.multifamily.svg");
}
.industrylisting .duplex::before{
    background-image: url("https://deolproperties.com/wp-content/uploads/2025/09/7.duplex.svg");
}
.industrylisting li {
    display: flex;
    align-items: center;
    padding: 8px 20px;
}
.industrylisting li:hover, .industrylisting li.active{
    background-color: var(--thm-color-1);
    border-radius: 45px;
    cursor: pointer;
}

.hb-slider .custom-prev-arrow{
    display:none !important;
}
.hbtreandingareas {
    display: flex;
    align-items: center;
    column-gap: 20px;
}
.hbsliderouter .hb-slider {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    column-gap: 15px;
}
.hbtreandingareas h2 {
    font-size: 25px;
    line-height: 25px;
    font-weight: 500;
    margin-bottom: 0;
}
.hb-slider p {
    font-size: 16px;
    padding: 8px 12px;
    border-radius: 45px;
    color: #969696;
    font-weight: 400;
    background: var(--color-white);
}
.hb-search, .hb-search:hover {
    color: var(--color-white);
    background: var(--thm-color-1);
    border-radius: 45px !important;
    border-top-left-radius: 45px;
    border-bottom-left-radius: 45px; 
    padding: 8px 15px;
}
.hb-form input[type="text"] {
    border: unset;
    border-radius: unset;
    background: unset;
}
.hbsearchsection {
    background: var(--color-white);
    border-radius: 45px;
    padding: 14px 23px;
}

.hb-input-common {
    position: relative;
}
.hb-input-common::before{
    content: "";
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
}
.hb-input-name::before {
    background: url("https://deolproperties.com/wp-content/uploads/2025/09/colored-home.svg") no-repeat center center;
    background-size: contain;
}
.hb-input-location::before {
    background: url("https://deolproperties.com/wp-content/uploads/2025/09/colored-location.svg") no-repeat center center;
    background-size: contain;
}
.hb-input-project::before {
    background: url("https://deolproperties.com/wp-content/uploads/2025/09/colored-project.svg") no-repeat center center;
    background-size: contain;
}
.hb-input-devp::before {
    background: url("https://deolproperties.com/wp-content/uploads/2025/09/colored-developer.svg") no-repeat center center;
    background-size: contain;
}

.hb-input-common input[type="text"] {
    padding-left: 40px; /* add space for icon */
}

.hb-input-name::after, .hb-input-location::after, .hb-input-project::after {
    content: "";
    position: absolute;
    right: 10px;   /* adjust to show after input */
    top: 50%;
    transform: translateY(-50%);
    width: 1.5px;
    height:70px;
    background: url("https://deolproperties.com/wp-content/uploads/2025/09/line.svg") no-repeat center center;
    background-size: contain;
}
.hbcountries {
    display: flex;
    column-gap: 8px;
}
.countryouter {
    background: rgba(255, 255, 255, 0.3);
    padding: 7px 30px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    row-gap: 3px;
    align-items: center;
}
.cntry-name{
    font-size: 10px;
    line-height: 16px;
}
.cntry-aval{
    font-size: 8px;
    line-height: 11px;
}
.common-h2{
    font-size: 34px;
    line-height: 36px;
    color:var(--color-black);
    text-align: center;
    font-weight: 600;
    margin-bottom: 30px;
}
.common-h2 span{
    color:var(--thm-color-1);
}
.browse-our-top-picks, .featured-products, .explore-neighbour, .upcomingprojects{
    margin-top:80px;
}
.top-picks-container {
    margin-left: 80px;
    overflow: hidden;
}

.swiper-slide {
  background: #fff;
  overflow: hidden;
  /* box-shadow: 0 4px 15px rgba(0,0,0,0.1); */
}
.ourtoppickinner img{
    border-radius:12px;
    width:100%;
}