/* Fazal Realty — Unified Dark Luxury Theme
   Shared visual language across public pages. */
:root{
  --fr-navy:#0B1F3A;
  --fr-deep:#071527;
  --fr-surface:#11294D;
  --fr-gold:#C5A35A;
  --fr-gold-2:#D4AF37;
  --fr-ivory:#F5F1E8;
  --fr-muted:#C5CEDB;
  --fr-border:rgba(197,163,90,.25);
}

html{scroll-behavior:smooth;background:var(--fr-deep)}
body{margin:0;background:var(--fr-deep);color:var(--fr-ivory);font-family:'Lato','Inter',Arial,sans-serif}
body,body *{scrollbar-color:var(--fr-gold) var(--fr-deep)}
a{color:inherit}

/* Shared page atmosphere */
#fazal-home-page,
.page-services,
#founder,
#specializations,
.contact-section,
.map-section,
.policy-hero,
.policy-content-card,
.sg-footer{background-color:var(--fr-deep)!important;color:var(--fr-ivory)}

/* Generic inner-page hero: same visual background, different content */
.hero-section,
#fazal-home-page .fazal-ref-hero-banner{
  background-color:var(--fr-deep)!important;
  border-bottom:3px solid #C5A35A!important;
}
.hero-section{min-height:calc(100vh - 115px)!important;height:calc(100vh - 115px)!important;padding:40px 0!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;box-sizing:border-box!important}
.hero-bg-img{
  background-size:cover!important;
  background-position:center!important;
  opacity:1!important;
}
.hero-overlay{
  background:linear-gradient(90deg,rgba(7,21,39,.97) 0%,rgba(7,21,39,.90) 45%,rgba(7,21,39,.60) 72%,rgba(7,21,39,.35) 100%)!important;
}

/* Common cards and panels */
.policy-content-card,
.founder-role-card,
.founder-principle-card,
.spec-card,
.contact-form-wrapper,
.office-photo-card,
.sg-insight-card,
.home-service,
.home-why-card,
.home-diligence-point{
  background:linear-gradient(145deg,rgba(17,41,77,.94),rgba(7,21,39,.94))!important;
  border-color:var(--fr-border)!important;
  color:var(--fr-ivory)!important;
  box-shadow:0 18px 45px rgba(0,0,0,.24)!important;
}

/* Typography on formerly light sections */
#fazal-home-page .home-section-head h2,
#fazal-home-page .home-content-title,
#fazal-home-page .home-service h3,
#fazal-home-page .home-why-card h3,
#fazal-home-page .home-section-head p,
#fazal-home-page .home-content-text,
#fazal-home-page .home-checks li,
#fazal-home-page .home-service p,
#fazal-home-page .home-service li,
#fazal-home-page .home-stat-label,
#fazal-home-page .home-why-card p{
  color:var(--fr-ivory)!important;
}
#fazal-home-page .home-section-cream{background:var(--fr-navy)!important}
#fazal-home-page .home-stat-label{color:var(--fr-muted)!important}

/* Home hero: sized after aboutus.php hero banner structure */
@media (min-width: 993px) {
  #fazal-home-page .fazal-ref-hero-banner {
    height: calc(100vh - 108px) !important;
    min-height: calc(100vh - 108px) !important;
    max-height: calc(100vh - 108px) !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: hidden !important;
    border-bottom: 3px solid #C5A35A !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }
  #fazal-home-page .fazal-ref-hero-container {
    width: min(1340px, 92%);
    padding: 30px 0 !important;
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
  }
  #fazal-home-page .fazal-ref-hero-left {
    max-width: 760px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
  }
  #fazal-home-page .fazal-ref-eyebrow {
    margin-bottom: 16px !important;
    font-size: 13.5px !important;
    letter-spacing: 3px !important;
  }
  #fazal-home-page .fazal-ref-title {
    font-size: clamp(38px, 4.5vw, 56px) !important;
    line-height: 1.18 !important;
    margin-bottom: 22px !important;
  }
  #fazal-home-page .fazal-ref-desc {
    max-width: 660px !important;
    font-size: 16px !important;
    line-height: 1.72 !important;
    margin-bottom: 28px !important;
  }
  #fazal-home-page .fazal-ref-value-points {
    margin-bottom: 28px !important;
    margin-top: 0 !important;
    padding-bottom: 0 !important;
  }
  #fazal-home-page .fazal-ref-cta-row {
    margin-bottom: 24px !important;
    gap: 18px !important;
  }
  #fazal-home-page .fazal-ref-btn-primary, #fazal-home-page .fazal-ref-btn-secondary {
    padding: 14px 32px !important;
    font-size: 14px !important;
  }
  #fazal-home-page .fazal-ref-bottom-rera {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    margin-top: 6px !important;
  }
}
#fazal-home-page .fazal-ref-features{gap:0!important;margin-bottom:24px!important;max-width:640px!important}
#fazal-home-page .fazal-ref-feature{padding-right:18px!important;margin-right:18px!important}
#fazal-home-page .fazal-ref-feature-icon{width:46px!important;height:46px!important;min-width:46px!important;font-size:18px!important}
#fazal-home-page .fazal-ref-feature-label{font-size:12.5px!important;line-height:1.35!important}
#fazal-home-page .fazal-ref-rera-bar{font-size:12.5px!important;margin-top:4px!important}
#fazal-home-page .fazal-ref-stats-strip{display:block!important}


/* Inner hero headings */
.hero-section h1{font-size:clamp(38px,5vw,64px)!important;line-height:1.08!important;color:var(--fr-ivory)!important}
.hero-section h1 span{color:var(--fr-gold)!important}

/* Make generic hero description blocks quieter */
.hero-section p{color:var(--fr-muted)!important}
.hero-section [style*="background: rgba(17, 41, 77"],
.hero-section [style*="background:rgba(17,41,77"]{box-shadow:none!important}

/* Section rhythm */
#founder,.page-services,#specializations,.contact-section,.map-section{border-top:1px solid rgba(197,163,90,.08)}

/* Buttons */
button,.home-btn,.home-cta-button,[class*="btn"],[class*="button"]{
  font-family:'Montserrat','Inter',sans-serif;
}

/* Footer */
.sg-footer{background:#05101E!important;border-top:1px solid rgba(197,163,90,.45)!important}
.sg-footer .sg-about,.sg-footer li,.sg-footer p{color:var(--fr-muted)}
.sg-footer a:hover{color:var(--fr-gold)!important}

/* Shared gold details */
.policy-title,.section-title,.page-services h2,.page-why h2{color:var(--fr-ivory)!important}
.policy-title span,.section-title span,.page-services h2 span,.page-why h2 span{color:var(--fr-gold)!important}

/* Global Overflow Safety */
html, body {
  overflow-x: clip !important;
  width: 100% !important;
  max-width: 100vw !important;
}

img {
  max-width: 100% !important;
  height: auto !important;
}

/* =========================================================
   1. TABLET RESPONSIVE BREAKPOINT (768px – 1024px)
   ========================================================= */
@media (min-width: 768px) and (max-width: 1024px) {
  .hero-section, .policy-hero {
    min-height: auto !important;
    height: auto !important;
    padding: 55px 24px 45px !important;
  }
  #fazal-home-page .fazal-ref-hero-banner {
    min-height: auto !important;
    height: auto !important;
    padding: 50px 0 40px !important;
  }
  #fazal-home-page .fazal-ref-hero-container {
    padding: 20px 24px !important;
    width: 90% !important;
  }
  #fazal-home-page .fazal-ref-hero-left {
    max-width: 100% !important;
    text-align: center !important;
    align-items: center !important;
  }
  #fazal-home-page .fazal-ref-title {
    font-size: clamp(34px, 4.6vw, 44px) !important;
    line-height: 1.18 !important;
    text-align: center !important;
    margin-bottom: 18px !important;
  }
  #fazal-home-page .fazal-ref-desc {
    font-size: 15.5px !important;
    line-height: 1.65 !important;
    text-align: center !important;
    margin-bottom: 24px !important;
    max-width: 680px !important;
  }
  #fazal-home-page .fazal-ref-eyebrow {
    font-size: 13px !important;
    letter-spacing: 3px !important;
    justify-content: center !important;
  }
  #fazal-home-page .fazal-ref-cta-row {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    width: 100% !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
  }
  #fazal-home-page .fazal-ref-btn-primary,
  #fazal-home-page .fazal-ref-btn-secondary {
    width: auto !important;
    padding: 14px 28px !important;
    font-size: 14.5px !important;
    border-radius: 50px !important;
    box-sizing: border-box !important;
  }
  #fazal-home-page .fazal-ref-bottom-rera {
    justify-content: center !important;
    flex-direction: row !important;
    gap: 14px !important;
    text-align: center !important;
  }
  .fazal-hero-watermark,
  .hero-watermark {
    width: clamp(340px, 35vw, 440px) !important;
    height: clamp(340px, 35vw, 440px) !important;
    opacity: 0.06 !important;
    pointer-events: none !important;
  }
  .policy-content-card,
  .founder-role-card,
  .spec-card,
  .home-service,
  .contact-form-wrapper {
    padding: 30px 24px !important;
    border-radius: 14px !important;
  }
}

/* =========================================================
   2. MOBILE RESPONSIVE BREAKPOINT (320px – 767px)
   ========================================================= */
@media (max-width: 767px) {
  .hero-section, .policy-hero {
    min-height: auto !important;
    height: auto !important;
    padding: 45px 16px 35px !important;
  }
  #fazal-home-page .fazal-ref-hero-banner {
    min-height: auto !important;
    height: auto !important;
    padding: 30px 0 24px !important;
  }
  #fazal-home-page .fazal-ref-hero-container {
    padding: 16px 14px !important;
    width: 92% !important;
  }
  #fazal-home-page .fazal-ref-hero-left {
    max-width: 100% !important;
    text-align: center !important;
    align-items: center !important;
  }
  #fazal-home-page .fazal-ref-title {
    font-size: clamp(26px, 7.2vw, 34px) !important;
    line-height: 1.22 !important;
    text-align: center !important;
    margin-bottom: 14px !important;
  }
  #fazal-home-page .fazal-ref-desc {
    font-size: 13.5px !important;
    line-height: 1.6 !important;
    text-align: center !important;
    margin-bottom: 18px !important;
  }
  #fazal-home-page .fazal-ref-eyebrow {
    font-size: 11px !important;
    letter-spacing: 2px !important;
    justify-content: center !important;
  }
  #fazal-home-page .fazal-ref-cta-row {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 320px !important;
    gap: 10px !important;
    margin: 0 auto 20px auto !important;
  }
  #fazal-home-page .fazal-ref-btn-primary,
  #fazal-home-page .fazal-ref-btn-secondary {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 13px 18px !important;
    font-size: 13.5px !important;
    box-sizing: border-box !important;
    min-height: 46px !important;
  }
  #fazal-home-page .fazal-ref-bottom-rera {
    justify-content: center !important;
    flex-direction: column !important;
    gap: 6px !important;
    text-align: center !important;
  }
  .fazal-hero-watermark,
  .hero-watermark {
    width: clamp(220px, 45vw, 300px) !important;
    height: clamp(220px, 45vw, 300px) !important;
    opacity: 0.04 !important;
    pointer-events: none !important;
  }
  .policy-content-card,
  .founder-role-card,
  .spec-card,
  .home-service,
  .contact-form-wrapper {
    padding: 22px 16px !important;
    border-radius: 12px !important;
  }
}

/* Header shared font */
#fazal-header-wrapper{font-family:'Montserrat','Inter',sans-serif!important}
#fazal-header-wrapper .fazal-header{background:rgba(7,21,39,.96)!important;border-bottom:1px solid rgba(197,163,90,.55)!important}
@media (min-width: 1025px) {
  #fazal-header-wrapper .fazal-header-inner{min-height:58px!important}
  #fazal-header-wrapper .fazal-logo-img{height:66px!important;max-width:95px!important}
  #fazal-header-wrapper .fazal-nav-links{gap:26px!important}
  #fazal-header-wrapper .fazal-nav-links a:not(.fazal-cta-btn){font-size:14.5px!important}
  #fazal-header-wrapper .fazal-cta-btn{height:42px!important;padding:0 23px!important}
}

.policy-hero{
  position:relative!important;
  min-height:260px!important;
  padding:60px 20px 40px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:
    linear-gradient(90deg,rgba(7,21,39,.97),rgba(7,21,39,.82)),
    url('hero-insights-bg.jpg') center/cover no-repeat!important;
  border-bottom:1px solid rgba(197,163,90,.45)!important;
}
.policy-content-card{background:linear-gradient(145deg,rgba(17,41,77,.96),rgba(7,21,39,.96))!important}