/* =========================================================
   ANSRAJ REALTY — theme layer (sits on top of style.css)
   Tokens:
   --ar-navy   #10233A   (deep header/footer navy — trust, HQ)
   --ar-gold   #C89A4B   (Gurugram HQ / signature accent)
   --ar-coral  #FA4A4A   (inherited CTA red from base template)
   --ar-cream  #FBF7EF   (warm section background)
   ========================================================= */
:root{
  --ar-navy: #10233A;
  --ar-navy-2: #16314F;
  --ar-gold: #C89A4B;
  --ar-gold-light: #E9CE97;
  --ar-cream: #FBF7EF;
  --ar-ink-sub: #7C8592;
}

/* ---------------- Top contact bar ---------------- */
.ar-topbar{
  background: var(--ar-navy);
  color: #cfd8e3;
  font-size: 1.3rem;
}
.ar-topbar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  padding: 0.8rem 0;
  flex-wrap:wrap;
}
.ar-topbar__right{ display:flex; gap:2rem; }
.ar-topbar a{ color:#e7ecf2; }
.ar-topbar a:hover{ color: var(--ar-gold); }
@media (max-width:767px){
  .ar-topbar__left{ display:none; }
  .ar-topbar__inner{ justify-content:center; }
}

/* ---------------- Brand mark ---------------- */
.ar-brand{ display:flex; align-items:center; gap:1.1rem; }
.ar-brand__mark{
  width:4.4rem; height:4.4rem;
  border-radius:0.9rem;
  background: linear-gradient(135deg, var(--ar-navy) 0%, var(--ar-navy-2) 60%, var(--ar-gold) 130%);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading-family);
  font-weight:800; font-size:1.7rem; letter-spacing:0.5px;
}
.ar-brand__text{ display:flex; flex-direction:column; line-height:1.2; }
.ar-brand__name{ font-weight:800; font-size:1.9rem; color: var(--ar-navy); font-family: var(--font-heading-family); }
.ar-brand__tag{ font-size:1.1rem; letter-spacing:0.5px; text-transform:uppercase; color: var(--ar-gold); font-weight:700; }
.ar-brand--footer .ar-brand__name{ color:#fff; }

/* ---------------- Nav polish ---------------- */
.main__menu--link.active{ color: var(--color-hover); }
.ar-submenu-tag{
  display:inline-block; margin-left:0.6rem;
  font-size:1.05rem; padding:0.1rem 0.7rem; border-radius:2rem;
  background: rgba(200,154,75,0.14); color: var(--ar-gold-dark, #a67c2f);
  text-transform:uppercase; letter-spacing:0.3px;
}
.ar-hq-badge{
  display:inline-block; margin-left:0.5rem;
  font-size:1rem; font-weight:800; padding:0.1rem 0.6rem; border-radius:2rem;
  background: var(--ar-gold); color:#fff;
}
.ar-submenu-viewall a{ font-weight:700; color: var(--color-hover) !important; }

.ar-get-quote{ letter-spacing:0.3px; }

/* ---------------- Mobile menu ---------------- */
.ar-mobile-toggle{
  width:4rem; height:4rem; border:0; background:var(--ar-navy); border-radius:0.6rem;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
}
.ar-mobile-toggle span{ width:2rem; height:2px; background:#fff; display:block; }
.ar-mobile-menu{ width: 320px; }
.ar-mobile-menu__nav ul{ list-style:none; padding:0 2rem; margin:2rem 0 0; }
.ar-mobile-menu__nav > ul > li{ border-bottom:1px solid var(--color-border); }
.ar-mobile-menu__nav a{ display:block; padding:1.3rem 0; font-weight:700; color:var(--color-foreground); }
.ar-mobile-menu__nav details summary{ padding:1.3rem 0; font-weight:700; cursor:pointer; list-style:none; }
.ar-mobile-menu__nav details ul{ padding-left:1.5rem; margin:0 0 1rem; }
.ar-mobile-menu__nav details ul a{ padding:0.8rem 0; font-weight:500; color:var(--color-foreground-sub); }
.ar-mobile-menu__cta{ display:block; text-align:center; margin:2rem; }

/* =========================================================
   HERO — compact, slider-driven, high contrast
   ========================================================= */
.ar-hero{ position:relative; overflow:hidden; }
.ar-hero__slider{ position:relative; height: 54rem; max-height: 74vh; }
@media (max-width:767px){ .ar-hero__slider{ height: 46rem; max-height:none; } }

.ar-hero__slide{ position:relative; height:100%; width:100%; }
.ar-hero__slide img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.ar-hero__slide::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(16,35,58,0.92) 0%, rgba(16,35,58,0.55) 45%, rgba(16,35,58,0.25) 100%);
}
.ar-hero__slide-content{
  position:relative; z-index:2; height:100%;
  display:flex; flex-direction:column; justify-content:center;
  max-width: 62rem; padding: 3rem 0;
}
.ar-hero__eyebrow{
  display:inline-flex; align-items:center; gap:0.8rem;
  color: var(--ar-gold-light); font-weight:700; text-transform:uppercase;
  font-size:1.4rem; letter-spacing:1px; margin-bottom:1.5rem;
}
.ar-hero__eyebrow::before{ content:""; width:2.4rem; height:2px; background:var(--ar-gold); display:inline-block; }
.ar-hero__title{ color:#fff; font-size:3.2rem; line-height:1.15; margin-bottom:1.6rem; }
@media (min-width:768px){ .ar-hero__title{ font-size:4.4rem; } }
@media (min-width:1200px){ .ar-hero__title{ font-size:5.2rem; } }
.ar-hero__title span{ color: var(--ar-gold); }
.ar-hero__desc{ color:#dbe2ea; font-size:1.6rem; max-width:46rem; margin-bottom:2.6rem; }
.ar-hero__stats{ display:flex; gap:3rem; }
.ar-hero__stat b{ display:block; color:#fff; font-size:2.2rem; font-family:var(--font-heading-family); }
.ar-hero__stat span{ color:#aab6c4; font-size:1.3rem; }

.ar-hero .swiper-pagination{ bottom:2rem !important; left:0; text-align:left; padding-left: var(--offset-fluid, 1.5rem); }
.ar-hero .swiper-pagination-bullet{ background:#fff; opacity:0.5; }
.ar-hero .swiper-pagination-bullet-active{ opacity:1; background:var(--ar-gold); }
.ar-hero .swiper__nav--btn{ opacity:1; visibility:visible; z-index:3; }

/* Slim search bar overlapping hero — kept minimal on purpose */
.ar-search{
  position:relative; z-index:3; margin-top:-4.5rem;
}
@media (max-width:767px){ .ar-search{ margin-top:-2rem; } }
.ar-search__bar{
  background:#fff; border-radius:1.2rem; box-shadow:0 20px 45px rgba(16,35,58,0.18);
  padding:1.2rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center;
}
.ar-search__field{ flex:1 1 180px; min-width:160px; }
.ar-search__field label{ font-size:1.1rem; text-transform:uppercase; letter-spacing:0.4px; color:var(--ar-ink-sub); font-weight:700; margin-bottom:0.3rem; }
.ar-search__field select,
.ar-search__field input{
  width:100%; height:4.4rem; border:1px solid var(--color-border); border-radius:0.7rem; padding:0 1.2rem;
  font-size:1.4rem; background:#fff;
}
.ar-search__submit{ flex:0 0 auto; height:4.4rem; padding:0 2.4rem; }

/* =========================================================
   PROPERTY TYPE TABS  (Residential / Commercial / Office Space)
   ========================================================= */
.ar-property-section .section__heading{ margin-bottom:2.5rem; }
.ar-type-tabs{
  display:inline-flex; gap:0.6rem; padding:0.5rem; background: var(--color-background-3);
  border-radius: 3rem; margin-bottom:3.5rem; flex-wrap:wrap;
}
.ar-type-tabs button{
  border:0; background:transparent; padding:1rem 2.2rem; border-radius:3rem;
  font-weight:700; font-size:1.5rem; color:var(--color-foreground-sub); cursor:pointer; transition:0.25s;
}
.ar-type-tabs button.active,
.ar-type-tabs button:hover{ background: var(--color-hover); color:#fff; }
.ar-type-tabs .ar-count{ opacity:0.7; font-weight:500; margin-left:0.4rem; }

.ar-property-panel{ display:none; }
.ar-property-panel.active{ display:block; }

.ar-property-card{
  background:#fff; border-radius:1.2rem; padding:1.5rem; box-shadow:0 4px 22px rgba(16,35,58,0.06);
  height:100%;
}
.ar-property-card__thumb{ position:relative; border-radius:0.8rem; overflow:hidden; margin-bottom:1.5rem; }
.ar-property-card__thumb img{ width:100%; height:20rem; object-fit:cover; display:block; }
.ar-property-card__badge{
  position:absolute; top:1.2rem; left:1.2rem; background:var(--color-hover); color:#fff;
  font-size:1.2rem; font-weight:700; padding:0.4rem 1.2rem; border-radius:2rem;
}
.ar-property-card__price{ color:var(--color-hover); font-weight:800; font-size:1.9rem; margin-bottom:0.4rem; }
.ar-property-card__title{ font-size:1.7rem; margin-bottom:0.8rem; }
.ar-property-card__loc{ color:var(--ar-ink-sub); font-size:1.4rem; margin-bottom:1.4rem; }
.ar-property-card__meta{ display:flex; gap:1.6rem; padding-top:1.3rem; border-top:1px solid var(--color-border); font-size:1.3rem; color:var(--color-foreground-sub); }
.ar-property-card__meta b{ color:var(--color-foreground); }

/* =========================================================
   "FIND HOME BY LOCATION" — Gurugram spotlight
   ========================================================= */
.ar-location-section{
  background: var(--ar-navy);
  position:relative; overflow:hidden;
}
.ar-location-section::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(200,154,75,0.16) 0, transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(200,154,75,0.10) 0, transparent 45%);
}
.ar-location-hq{
  position:relative; z-index:1;
  display:flex; align-items:center; gap:1.2rem;
  background: rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12);
  padding:1rem 1.8rem; border-radius:3rem; margin-bottom:2rem; width:fit-content;
}
.ar-location-hq__pin{
  width:3.6rem; height:3.6rem; border-radius:50%; background:var(--ar-gold);
  display:flex; align-items:center; justify-content:center; color:#10233A; font-weight:800; flex-shrink:0;
}
.ar-location-hq b{ color:#fff; display:block; font-size:1.5rem; }
.ar-location-hq span{ color:#b9c3d1; font-size:1.3rem; }

.ar-location-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1fr; gap:1.6rem; }
@media (min-width:576px){ .ar-location-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:992px){ .ar-location-grid{ grid-template-columns:repeat(3,1fr); } }

.ar-location-card{
  position:relative; border-radius:1.4rem; overflow:hidden; height:22rem;
  display:flex; align-items:flex-end; padding:2rem;
  background: linear-gradient(160deg, #1c3a5c, #10233A);
  border: 1px solid rgba(255,255,255,0.08);
  transition: transform .3s ease, border-color .3s ease;
}
.ar-location-card:hover{ transform: translateY(-6px); border-color: var(--ar-gold); }
.ar-location-card.ar-location-card--hq{
  background: linear-gradient(160deg, #C89A4B, #8f6a2c);
  grid-column: span 1;
}
@media (min-width:992px){ .ar-location-card.ar-location-card--hq{ grid-row: span 2; height:auto; } }
.ar-location-card__body{ position:relative; z-index:1; width:100%; }
.ar-location-card__badge{
  display:inline-block; font-size:1.1rem; font-weight:800; text-transform:uppercase; letter-spacing:0.5px;
  background:rgba(255,255,255,0.16); color:#fff; padding:0.3rem 1rem; border-radius:2rem; margin-bottom:1rem;
}
.ar-location-card__name{ color:#fff; font-size:2.1rem; margin-bottom:0.6rem; }
.ar-location-card__count{ color:rgba(255,255,255,0.8); font-size:1.4rem; }
.ar-location-card__link{
  display:inline-flex; align-items:center; gap:0.5rem; color:#fff; font-weight:700; margin-top:1.4rem; font-size:1.4rem;
}

/* =========================================================
   Property type counters (Residential / Commercial / Office / Farm)
   ========================================================= */
.ar-type-counter{
  text-align:center; background:#fff; border-radius:1.2rem; padding:3rem 1.5rem;
  box-shadow:0 4px 22px rgba(16,35,58,0.06); transition:transform .25s ease;
}
.ar-type-counter:hover{ transform:translateY(-6px); }
.ar-type-counter__icon{ font-size:3.4rem; margin-bottom:1.2rem; }
.ar-type-counter__count{ font-size:2.6rem; font-weight:800; color:var(--color-hover); font-family:var(--font-heading-family); }
.ar-type-counter__label{ font-weight:700; margin-top:0.5rem; }