.elementor-kit-8{--e-global-color-primary:#222222;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1180px;}.e-con{--container-max-width:1180px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(min-width:1700px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1340px;}.e-con{--container-max-width:1340px;}}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* === HERO: move only the title down, keep tight stack === */

/* Reset any previous margins/padding so nothing leaks in */
.elementor-kit-8 h1:first-of-type,
.elementor-kit-8 h4:first-of-type,
.elementor-kit-8 h4:first-of-type + form {
  margin: 08 !important;
  padding: 0 !important;
}

/* 1) Push the TITLE down from the top of the hero */
.elementor-kit-8 h1:first-of-type {
  margin-top: 0px !important;   /* <-- increase/decrease to position lower/higher */
  margin-bottom: 65Px !important; /* small gap to subtitle */
  line-height: 1.2 !important;
}

/* 2) Keep SUBTITLE close to title, slight gap to form */
.elementor-kit-8 h4:first-of-type {
  margin-bottom: px !important;  /* tighten to form */
  line-height: 1.4 !important;
  font-weight: 400 !important;
}

/* 3) Small breathing room above the form */
.elementor-kit-8 h4:first-of-type + form {
  margin-top: 8px !important;  /* remove your -15px hack */
}

/* Optional: smaller offsets on mobile */
@media (max-width: 768px) {
  .elementor-kit-8 h1:first-of-type { margin-top: 50px !important; }
}





/* Make subtitle text stronger */
.elementor-kit-8 h4:first-of-type {
  color: #d4af37  !important;   /* pure white */
  opacity: 1 !important;       /* remove faded effect */
 optional: adds contrast on busy backgrounds */
}



.header-widget .button i {
    display: none !important;
}

.header-widget .button::before {
    content: "\f073"; /* Calendar icon */
    font-family: "FontAwesome"; /* FA4 name */
    font-style: normal;
    font-weight: normal;
    margin-right: 8px;
}

}



/* === Keep solid color for Our Properties boxes with transparent header === */
body.transparent-header .highlighted-category {
  background: var(--listeo-main-color) !important;
  background-image: none !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
  border: none !important;
  filter: none !important;
}

/* make text white */
body.transparent-header .highlighted-category h4 {
  color: #fff !important;
}

/* make icon white */
body.transparent-header .highlighted-category i svg path {
  fill: #fff !important;
}

/* subtle hover effect */
.highlighted-category:hover {
  filter: brightness(1.08);
  transition: all 0.25s ease;
}
--------

/* Force-override any inline/background-image/overlay on highlighted categories */
body.transparent-header .highlighted-categories,
body.transparent-header .highlighted-categories .highlighted-category,
body.transparent-header a.highlighted-category,
a.highlighted-category[style] {
  background-image: none !important;
  background: #C9A646 !important;              /* your gold */
  background-color: #C9A646 !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
  filter: none !important;
  border: none !important;
}

/* Remove any pseudo-element overlays */
body.transparent-header .highlighted-categories .highlighted-category::before,
body.transparent-header .highlighted-categories .highlighted-category::after,
.highlighted-category::before,
.highlighted-category::after {
  display: none !important;
  content: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* Ensure text + svg icons stay white */
body.transparent-header .highlighted-category h4,
body.transparent-header .highlighted-category i svg path {
  color: #fff !important;
  fill: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

--------

/* Force-override any inline/background-image/overlay on highlighted categories */
body.transparent-header .highlighted-categories,
body.transparent-header .highlighted-categories .highlighted-category,
body.transparent-header a.highlighted-category,
a.highlighted-category[style] {
  background-image: none !important;
  background: #C9A646 !important;              /* your gold */
  background-color: #C9A646 !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
  filter: none !important;
  border: none !important;
}

/* Remove any pseudo-element overlays */
body.transparent-header .highlighted-categories .highlighted-category::before,
body.transparent-header .highlighted-categories .highlighted-category::after,
.highlighted-category::before,
.highlighted-category::after {
  display: none !important;
  content: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* Ensure text + svg icons stay white */
body.transparent-header .highlighted-category h4,
body.transparent-header .highlighted-category i svg path {
  color: #fff !important;
  fill: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Hover effect - lighter gold on hover */
body.transparent-header .highlighted-categories .highlighted-category:hover,
body.transparent-header a.highlighted-category:hover {
  background: #D4B85B !important; /* lighter gold */
  background-color: #D4B85B !important;
  transition: background 0.3s ease; /* smooth transition */
}
--------------
/* Fix mobile menu icon color on transparent header */
body.transparent-header .mmenu-trigger,
body.transparent-header .mmenu-trigger span,
body.transparent-header .mmenu-trigger span::before,
body.transparent-header .mmenu-trigger span::after {
  background-color: #C9A646 !important; /* gold */
  transition: background-color 0.3s ease;
}

/* Hover effect - lighter gold */
body.transparent-header .mmenu-trigger:hover span,
body.transparent-header .mmenu-trigger:hover span::before,
body.transparent-header .mmenu-trigger:hover span::after {
  background-color: #D4B85B !important; /* lighter gold */
}
--------------


/* Shrink mobile burger icon slightly */
body.transparent-header .mmenu-trigger {
    transform: scale(0.9);
    display: inline-block; /* ensures transform works */
}

/* Optional: adjust vertical alignment if needed */
body.transparent-header .mmenu-trigger {
    margin-top: 15px; /* tweak to align with logo */
}


--------------/* End custom CSS */