/* PropertyFey global responsive fixes */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, video, iframe, svg, canvas { max-width: 100%; height: auto; }
.container { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; }
.site-header, .site-footer, main, section { max-width: 100%; }
.site-footer { overflow: hidden; }
.site-footer .container { min-width: 0; }
.footer-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)) !important;
  gap: 2rem !important;
  align-items: start;
}
.footer-grid > *, .footer-brand, .footer-col { min-width: 0; max-width: 100%; }
.footer-brand p, .footer-col a, .footer-col p {
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}
.footer-col a { display: block; }
.footer-socials { display: flex; flex-wrap: wrap; gap: .65rem; }
.aed-symbol { display:inline-flex !important; width:20px; height:20px; vertical-align:-4px; align-items:center; justify-content:center; flex:0 0 auto; }
.aed-symbol img { width:100%; height:100%; object-fit:contain; display:block; }
.property-price, .pf-price, .price, [class*="price"] { overflow-wrap:anywhere; }
@media (max-width: 900px) {
  .container { padding-left: 1rem !important; padding-right: 1rem !important; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1.5rem !important; }
  .site-header .container { gap: .75rem; }
  .header-nav { max-width: 100%; }
}
@media (max-width: 640px) {
  body { font-size: 15px; }
  .container { padding-left: .9rem !important; padding-right: .9rem !important; }
  .footer-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 1.25rem !important; }
  .site-footer { padding-left: 0 !important; padding-right: 0 !important; }
  .footer-brand, .footer-col { width:100%; }
  .footer-socials { justify-content:flex-start; }
  .site-header .container { flex-wrap: wrap !important; }
  .header-nav { width:100%; justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap !important; padding-bottom:.25rem; }
  .header-nav a { flex:0 0 auto; }
  .search-hero, .hero, .property-hero { border-radius: 18px !important; padding-left: 1rem !important; padding-right: 1rem !important; }
  .property-grid, .properties-grid, .results-grid, .pf-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .property-card, .pf-card { min-width:0; width:100%; }
  .detail-grid, .property-layout, .details-layout, .content-grid { grid-template-columns:minmax(0,1fr) !important; }
  table { display:block; width:100%; overflow-x:auto; }
  input, select, textarea, button { max-width:100%; }
}

/* PropertyFey responsive hamburger navigation */
.pf-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  margin-left: auto;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: inherit;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  position: relative;
  z-index: 1002;
}
.pf-menu-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform .22s ease, opacity .22s ease;
}
.pf-menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.pf-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.pf-menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 768px) {
  .site-header { overflow: visible !important; position: relative; z-index: 1000; }
  .site-header .container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative;
  }
  .site-header .logo { min-width: 0; flex: 1 1 auto; }
  .site-header .logo-img { max-width: 180px; height: auto; }
  .pf-menu-toggle { display: inline-flex; flex: 0 0 44px; }
  .header-nav {
    display: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: .7rem 0 0 !important;
    padding: .55rem !important;
    border-radius: 14px;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .25rem !important;
    overflow: visible !important;
    white-space: normal !important;
    background: var(--nav-mobile-bg, #102a43);
    box-shadow: 0 14px 34px rgba(0,0,0,.2);
  }
  .header-nav.pf-menu-open { display: flex !important; }
  .header-nav a {
    width: 100%;
    flex: none !important;
    display: flex !important;
    align-items: center;
    gap: .55rem;
    padding: .78rem .85rem !important;
    border-radius: 9px;
    white-space: normal !important;
  }
  .header-nav a:hover,
  .header-nav a:focus-visible { background: rgba(255,255,255,.1); }
}


/* Final mobile navigation colour and contrast rules */
@media (max-width: 768px) {
  .pf-menu-toggle {
    background: #0b2b5e !important;
    color: #ffffff !important;
    border-color: rgba(255,255,255,.42) !important;
    box-shadow: 0 7px 18px rgba(11,43,94,.24) !important;
  }
  .pf-menu-toggle:hover,
  .pf-menu-toggle:focus-visible {
    background: #164a83 !important;
    color: #ffd84d !important;
    border-color: #ffd84d !important;
    outline: none !important;
  }
  .header-nav,
  nav.header-nav {
    background: linear-gradient(145deg, #0b1f3a, #0b2b5e) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
  }
  .header-nav a,
  nav.header-nav a,
  .header-nav .nav-cta,
  nav.header-nav .nav-cta {
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  .header-nav a i,
  nav.header-nav a i {
    color: inherit !important;
  }
  .header-nav a:hover,
  .header-nav a:focus-visible,
  .header-nav a.active,
  .header-nav a[aria-current="page"],
  nav.header-nav a:hover,
  nav.header-nav a:focus-visible,
  nav.header-nav a.active,
  nav.header-nav a[aria-current="page"] {
    color: #ffe45c !important;
    background: rgba(255,255,255,.12) !important;
    box-shadow: inset 3px 0 0 #ffe45c !important;
    outline: none !important;
  }
  .header-nav .nav-cta,
  nav.header-nav .nav-cta {
    background: #1677d2 !important;
    border: 1px solid rgba(255,255,255,.25) !important;
  }
  .header-nav .nav-cta:hover,
  .header-nav .nav-cta:focus-visible,
  nav.header-nav .nav-cta:hover,
  nav.header-nav .nav-cta:focus-visible {
    background: #1d8cff !important;
    color: #ffffff !important;
    border-color: #ffe45c !important;
  }
}
