@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-Bold.woff2') format('woff2'),
        url('fonts/EuclidCircularA-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-BoldItalic.woff2') format('woff2'),
        url('fonts/EuclidCircularA-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-SemiBoldItalic.woff2') format('woff2'),
        url('fonts/EuclidCircularA-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-SemiBold.woff2') format('woff2'),
        url('fonts/EuclidCircularA-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-MediumItalic.woff2') format('woff2'),
        url('fonts/EuclidCircularA-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-Medium.woff2') format('woff2'),
        url('fonts/EuclidCircularA-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-LightItalic.woff2') format('woff2'),
        url('fonts/EuclidCircularA-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-Italic.woff2') format('woff2'),
        url('fonts/EuclidCircularA-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-Light.woff2') format('woff2'),
        url('fonts/EuclidCircularA-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Euclid Circular A';
    src: url('fonts/EuclidCircularA-Regular.woff2') format('woff2'),
        url('fonts/EuclidCircularA-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body, *{
font-family: 'Euclid Circular A' !important;
}
.fa-brands, .fab {
    font-family: "Font Awesome 6 Brands" !important;
}


.header-lower .tf-btn.primary {
    display: none;
}

.mobile-button svg, .mobile-button:after, .mobile-button:before {
  color: #e3c06b;
}

.tf-btn.primary, .tf-btn:hover {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
  border-radius: 15px;
}
.tf-btn.primary:hover{
color: var(--primary-color);
}

/*********************EDITS***************/
.homeya-box.list-style-1, .homeya-box.property-item{
  flex-direction: column;
  position: relative;
}
.homeya-box.list-style-1 .content, .homeya-box.property-item .content{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0);
  pointer-events: none;
  padding: 10px 20px;
}
.homeya-box.property-item .content{
  bottom: 10px;
}
.homeya-box.property-item .archive-bottom{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0,0,0,0);
}
.homeya-box.list-style-1 .images-style img, .homeya-box.property-item .images-style img{
  width: 100%;
  height: 100%;
  object-fit: cover !important;
	aspect-ratio: 9 / 13;
}
/* Grid property cards: horizontal (landscape) image instead of the portrait 9/13.
   height:auto is required so aspect-ratio governs even when a parent (e.g. a
   homepage slider) gives the container a fixed height. Tune 4/3 -> 3/2 or 16/9
   for a wider crop. List view (list-style-1) keeps its own ratio. */
.homeya-box.property-item .images-style img{
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
}
.homeya-box.property-item .images-style{
  height: auto !important;
}
/* Square corners on the property cards (remove the theme's 12px rounded radius). */
.homeya-box.property-item,
.homeya-box.property-item .images-style,
.homeya-box.property-item .images-style img{
  border-radius: 0 !important;
}
/* Pagination: wrap the page numbers so a long list doesn't overflow off-screen.
   The row was a centered no-wrap inline-flex, which clipped the first pages
   (1-3) off the left edge when there were many pages. */
.flat-pagination{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 100%;
}
.flat-latest-property .swiper img{
  max-height: none !important;
}
.homeya-box.list-style-1 .content .archive-top .h7, .homeya-box.property-item .content .archive-top .h7{
  display: none;
}
.homeya-box.list-style-1 .content, .homeya-box.list-style-1 .content a, .homeya-box.list-style-1 .content a.link:hover, .homeya-box.list-style-1 .content .desc, .homeya-box.list-style-1 .content .meta-list .item .icon, .homeya-box.list-style-1 .content .meta-list .item span, .homeya-box.property-item .content, .homeya-box.property-item .content a, .homeya-box.property-item .content a.link:hover, .homeya-box.property-item .content .desc, .homeya-box.property-item .content .meta-list .item .icon, .homeya-box.property-item .content .meta-list .item span, .homeya-box.property-item .archive-bottom h6 {
  color: #fff;
}
.homeya-box.list-style-1 .content a.link:hover, .homeya-box.property-item .content a.link:hover{
  color: #fff !important;
}
.homeya-box.property-item .archive-bottom h6{
  margin-bottom: 0;
}
.homeya-box.property-item .archive-bottom .box-icon.w-52{
  width: 30px;
  height: 30px;
  background-color: transparent;
  color: #fff;
  padding: 0;
}
/*.homeya-box.list-style-1 .images-style{
  position: relative;
  padding-bottom: 100%;
}
.homeya-box.list-style-1 .images-style img{
  position: absolute;
}*/
.homeya-box.list-style-1 .content .archive-top, .homeya-box.property-item .content .archive-top{
  margin-bottom: 0;
  padding-bottom: 10px;
  border-bottom: 0;
}
.homeya-box .content .meta-list{
	justify-content: space-around;
/*background: var(--primary-color);
border-radius: 16px;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);*/
  padding: 10px;
}
.homeya-box .content .meta-list .item{
  flex-direction: column;
  gap: 3px;
}
.homeya-box .content .meta-list .item span, .swiper-button-next, .swiper-button-prev{
  color: #e5bd71;
}
@media (min-width: 768px) {
    .list-style-1 .images-style {
        max-width: 100%;
    }
}
@media only screen and (max-width: 575px) {
    .homeya-box.list-style-1 .images-style, .homeya-box.property-item .images-style {
        height: initial;
    }
}
.homeya-box.property-item .content{
  border-bottom: 0;
}




.flat-section.flat-recommended{
  background: #ffffff;
}
.box-title{
	margin-bottom: 30px;
  position: relative;
    padding-bottom: 30px;
}
.box-title:after{
display: block;
position: absolute;
width: 1px;
height: 100px;
content: '';
left: 50%;
transform: translateX(-50%);
background-color: var(--primary-color);
  top: 100%;
}
.flat-section.flat-recommended .box-title:after{
background-color: #fff;
}
.flat-section.flat-recommended h2.section-title{
color: #3b9ccf;
  font-size: 40px;
}
.flat-section.flat-recommended div.text-subtitle.text-primary{
color: #3b9ccf !important;
  font-size: 16px;
  font-weight: 300;
}
.flat-section.flat-recommended .nav-tab-recommended .nav-link-item{
	background-color: transparent;
  color: #a0a6b2;
  font-weight: normal;
}
.flat-section.flat-recommended .nav-tab-recommended .nav-link-item.active, .nav-tab-recommended .nav-link-item:hover{
	color: #3b9ccf;
}
.flat-section.flat-recommended .homeya-box{
  border: 0 none;
  border-radius: 0;
}
.section-title, .title, .tf-btn, .flat-title-page h2, .flat-banner-about h3, .main-header .main-menu .navigation>li>a, .flat-slider.home-1 .slider-content h1{
  font-weight: 300;
  text-transform: uppercase;
}
.homeya-box.property-item .content *{
	text-align: center;
}
.homeya-box .content .desc{
	justify-content: center;
}
.homeya-box .images-group:after{
background: linear-gradient(180deg,transparent 50%,#000);
  opacity: 1;
}
h4, .meta-item, .single-property-overview .info-box .item span, .header-property-detail .content-bottom .info-box .meta-item, .tf-btn{
font-weight: 300;
}
.flat-property-detail-v3, .info-box, .header-property-detail, .flat-latest-property{
background-color: #f4f4f4;
}
.flat-latest-property{ 
padding-top: 100px;
  border-top: 1px solid #a0a6b2;
}
.single-property-element:not(:last-child), .header-property-detail .content-top{
border-color: #a0a6b2;
}
body, h1, h2, h3, h4, h5, h6{
color: var(--primary-color);
}
.single-property-contact, .single-property-overview .info-box .item .box-icon{
border-radius: 0;
background-color: #fff;
}
.property-share-social .list-social .social{
border: 1px solid var(--primary-color);
}
.property-share-social .list-social .social:hover{

background-color: transparent;
}
.property-share-social .list-social .social:hover .icon{
  color: var(--primary-color);
}
/*.main-header.fixed-header{
background-color: transparent;
  justify-content: flex-end;
  padding: 0;
  position: initial;
}
.main-header.fixed-header .header-lower{
padding-left: 30px;
padding-right: 30px;
  background-color: var(--primary-color);
  position: sticky;
  top: 0;
}*/
.main-header{
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  background-color: transparent;
  position: fixed;
  z-index: 1000;
  border: 0 none !important;
}
.main-header:after{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
  background-color: rgba(0,0,0,0.7);
  display block;
  content: '';
}
.main-header .main-menu .navigation>li>a, .main-header:after{
transition: all linear 300ms;
}
.main-header:hover .main-menu .navigation>li>a{
color: var(--primary-color)}
.main-header .header-lower{
z-index: 2;
background-color: transparent;
}
.main-header .main-menu{
background-color: transparent;
}
/* CSS */
.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  /* No overflow:hidden here — that was clipping Category/Location dropdowns
     when they extend below the hero. The video iframe is already clipped by
     .hero__video (which has its own overflow:hidden), so removing it here is
     safe and lets dropdowns render over the cards section below. */
}

/* video fills the screen */
.hero__video {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

/* YouTube iframes use 16:9; this makes it cover like background-size: cover */
.hero__iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 177.78vh; /* 16/9 * 100 = 177.78 */
  height: 100vh;
  transform: translate(-50%, -50%);
  pointer-events: none; /* prevents clicks on the iframe */
}

/* If screen is wider than 16:9, switch to cover by width */
@media (min-aspect-ratio: 16/9) {
  .hero__iframe {
    width: 100%;
    height: 56.25vw; /* 9/16 * 100 = 56.25 */
  }
}

/* dark overlay (black with 0.2 opacity) */
.hero__shade {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.56);
  z-index: 1;
}

/* content overlay */
.hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 14px;
  padding: clamp(20px, 5vw, 72px);
  max-width: 900px;
  margin: 0 auto;
  color: #fff;
  text-align: center;
}

h1.hero__title {
  margin: 0;
  line-height: 1.05;
  font-weight: 300;
  text-transform: uppercase;
  color: #fff;
  font-size: 40px;
}

p.hero__desc {
  margin: 0;
  line-height: 1.5;
  opacity: 0.95;
	color: #fff;
  font-size: 20px;
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.hero__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border-radius: 25px;
  text-decoration: none;
  font-weight: 300;
  text-transform: uppercase;
  font-size: 16px;
  color: #fff;
  background: transparent;
  border: 1px solid #fff;
}
a.hero__cta:hover{
background-color: #fff;
color: var(--primary-color);
}
.hero__cta--ghost {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(6px);
}
.top-header{
display: none;
}
.loading-spinner, .loading-spinner *{
  background-color: transparent !important;
/*display: none !important;*/
}
.flat-tab-form .wd-find-select{
background-color: var(--primary-color);
      -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.wd-find-select .inner-group .form-style .form-control, .wd-find-select .inner-group .form-style .form-control, .wd-find-select .inner-group .form-style .nice-select{
padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  font-weight: 300;
  border-radius: 15px;
}
/* White labels ONLY when the search-bar sits on the dark hero (.flat-tab-form
   adds background-color: var(--primary-color)). The /properties mobile
   offcanvas uses .wd-find-select WITHOUT .flat-tab-form, so its labels keep
   the theme default (#161e2d) and stay readable on the light/grey panel. */
.flat-tab-form .wd-find-select .inner-group .form-style label,
.flat-tab-form .wd-find-select .inner-group .box-filter .filter-advanced,
.flat-tab-form .nav-tab-form.style-1 .nav-link-item.active,
.flat-tab-form .nav-tab-form.style-1 .nav-link-item:hover,
.flat-tab-form .wd-find-select.style-2 .inner-group .form-style label {
    color: #fff !important;
}
/* Nice-select dropdown panels (Category, etc.) ship with z-index:9 which is
   below cards/header — force them to sit above everything in the page. */
.nice-select .list {
    z-index: 1050 !important;
}
.nice-select.open {
    z-index: 1050 !important;
}
/* Select2 v4 default z-index is 1051, but .search-box-offcanvas is 1200 — so
   when Select2's dropdown is portaled to <body> via dropdownParent, it opens
   underneath the offcanvas. Force the dropdown above. */
.select2-container--open .select2-dropdown {
    z-index: 1300 !important;
}
/* When any nice-select inside the filter is open, elevate the .wd-find-select
   wrapper itself — otherwise the dropdown gets painted under the sibling
   .wd-search-form (Price/Square/Bedrooms section) that follows it in the DOM. */
.wd-find-select:has(.nice-select.open) {
    position: relative;
    z-index: 1100;
}
.form-style:has(.nice-select.open) {
    position: relative;
    z-index: 1100;
}

/* Uniform label style for every filter element on /properties (both the mobile
   offcanvas and the inline desktop filter). Equal size, weight, letter-spacing,
   and gap to the field — overrides each partial's ad-hoc utility classes
   (.mb-1, .mb-3, .title-select, .fw-5, .control-label, etc.). */
.wrap-filter-search label:not(.bedroom-label),
.search-box-offcanvas label:not(.bedroom-label) {
    display: block;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    line-height: 24px !important;
    margin-bottom: 8px !important;
    padding-bottom: 0 !important;
}

/* Uniform placeholder + value text across every filter input/select. Without
   these, Select2 textarea, nice-select current value, and .form-control inputs
   each had their own size/color. */
.wrap-filter-search input::placeholder,
.search-box-offcanvas input::placeholder,
.wrap-filter-search .select2-search__field::placeholder,
.search-box-offcanvas .select2-search__field::placeholder {
    color: #a3abb0 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    opacity: 1;
}
/* Nice-select shows the actively-selected option's text. When the default
   empty-value option is still selected ("All", "-- Select --"), render it as
   if it were a placeholder so it matches Select2's "All locations" colour. */
.wrap-filter-search .nice-select:has(.option.selected[data-value=""]) .current,
.search-box-offcanvas .nice-select:has(.option.selected[data-value=""]) .current {
    color: #a3abb0 !important;
}
.wrap-filter-search .form-control,
.search-box-offcanvas .form-control,
.wrap-filter-search .nice-select,
.search-box-offcanvas .nice-select,
.wrap-filter-search .nice-select .current,
.search-box-offcanvas .nice-select .current,
.wrap-filter-search .select2-search__field,
.search-box-offcanvas .select2-search__field {
    color: #161e2d !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}

/* Same border-radius on Reset (.secondary) and Find Properties (.primary) so
   they match. The primary had 15px from line 110, the secondary inherited 4px
   from the theme — this normalizes both. */
.wrap-filter-search .tf-btn,
.search-box-offcanvas .tf-btn,
.wd-search-form .tf-btn {
    border-radius: 15px !important;
}
/* Force offcanvas labels dark ONLY on mobile, where the offcanvas slides in
   as a white panel. On desktop the same .search-box-offcanvas markup is
   rendered inline against the dark hero, so the white-label rule should win.
   Breakpoint matches the theme's own .search-box-offcanvas-button media
   query (max-width: 767px). */
@media (max-width: 767px) {
    .search-box-offcanvas .flat-tab-form .wd-find-select .inner-group .form-style label,
    .search-box-offcanvas .flat-tab-form .wd-find-select.style-2 .inner-group .form-style label,
    .search-box-offcanvas .form-style label,
    .wrap-filter-search .form-style label {
        color: #161e2d !important;
    }
}
.wd-find-select .inner-group .form-style label{
padding-bottom: 10px;
}
.wd-find-select .inner-group .box-filter{
padding-top: 25px;}
.wd-find-select .inner-group .form-style{
border-color: transparent;}
.wd-find-select, .wd-find-select .tf-btn, .wd-find-select.style-2 .tf-btn{
border-radius: 10px !important;
}
.wd-find-select .tf-btn{
border: 1px solid #fff;
}
.flat-tab-form .nav-tab-form.style-1 .nav-link-item.active, .flat-tab-form .nav-tab-form.style-1 .nav-link-item:hover, .mobile-menu .bottom-canvas{
background-color: var(--primary-color);}
.mobile-button svg, .mobile-button:after, .mobile-button:before{
color: var(--primary-color);
}
.mobile-menu .navigation li.current li.current>a, .mobile-menu .navigation li.current>a, .mobile-menu .navigation li:hover>a, .mobile-menu .navigation li>a, .mobile-menu .mobi-icon-box .icon, .mobile-menu .mobi-icon-box a, .mobile-menu .login-box a, .mobile-menu .login-box span{
color: #fff;
}
.mobile-menu .button-mobi-sell a.tf-btn.primary{
background-color: #fff;
color: var(--primary-color);
}
.flat-title-page, .listing-no-map .flat-title-page{
padding-top: 100px;
}
button[data-value="list"], button[data-value="grid"]{
display: none !important; 
}
.search-box-offcanvas.container{
padding-left: 0;
padding-right: 0;
}
@media only screen and (max-width: 991px) {
  .mobile-menu .button-mobi-sell{
  display: none;
  }
  .mobile-menu .mobi-icon-box .box, .mobile-menu .menu-outer{
  border: 0 none;
    margin-bottom: 0;
  }
  .main-header{
  background-color: #fff;
}
  .main-header:after{
  display: none;
  }
}
.main-header:after {
    background-color: rgba(255, 255, 255, 1);
}
.main-header .main-menu .navigation>li>a {
    color: var(--primary-color);
}
.flag-tag {
  display: none;
}