/* ══════════════════════════════════════════
   Barez — Premium Stylesheet
   ══════════════════════════════════════════ */
:root {
  --gold:        #1a3d8f;
  --gold-light:  #2a5cc7;
  --gold-dark:   #0c1e50;
  --gold-muted:  rgba(26,61,143,0.12);
  --black:       #0A0A0A;
  --dark:        #111111;
  --dark2:       #161616;
  --dark3:       #1E1E1E;
  --white:       #FFFFFF;
  --text:        #1A1A1A;
  --text2:       #555555;
  --text3:       #888888;
  --light:       #F4F7FC;
  --light2:      #EBF0FA;
  --border:      #D0DCF0;
  --border-dark: rgba(26,61,143,0.20);
  --green:       #1A7340;
  --red:         #C0392B;
  --radius:      16px;
  --shadow:      0 4px 24px rgba(0,0,0,0.08);
  --shadow-lg:   0 16px 48px rgba(0,0,0,0.14);
  --shadow-gold: 0 8px 32px rgba(26,61,143,0.28);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Cairo', 'IBM Plex Sans Arabic', 'Segoe UI', Arial, sans-serif;
  direction: rtl;
  background: #fff;
  color: var(--text);
  font-weight: 400;
  line-height: 1.75;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
.c-gold { color: var(--gold); }
.page-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* ══ BUTTONS ══ */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 28px; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  border: none; transition: all .25s; font-family: inherit;
  letter-spacing: 0.01em;
}
.btn-lg  { padding: 16px 36px; font-size: 15px; border-radius: 12px; }
.btn-sm  { padding: 9px 20px; font-size: 13px; border-radius: 8px; }
.btn-gold { background: var(--gold); color: #fff; }
.btn-gold:hover { background: var(--gold-light); transform: translateY(-2px); box-shadow: var(--shadow-gold); }
.btn-ghost { background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.2); }
.btn-ghost:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.45); }
.btn-outline { background: transparent; color: var(--gold); border: 1.5px solid var(--gold); }
.btn-outline:hover { background: var(--gold); color: #fff; }
.btn-outline-dark { display: inline-flex; align-items: center; gap: 8px; padding: 13px 28px; border-radius: 10px; font-size: 14px; font-weight: 600; cursor: pointer; border: 1.5px solid rgba(26,26,26,.3); color: var(--text); background: transparent; font-family: inherit; transition: all .2s; }
.btn-outline-dark:hover { background: var(--text); color: #fff; border-color: var(--text); }
.btn-white { background: #fff; color: var(--dark); font-weight: 600; }
.btn-white:hover { background: var(--light); }

/* ══════════════════════════════════
   NAVBAR
══════════════════════════════════ */
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  padding: 0 24px;
  background: transparent;
  transition: background .35s, box-shadow .35s;
}
.navbar.scrolled {
  background: rgba(8,8,8,.97);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-dark);
  box-shadow: 0 4px 30px rgba(0,0,0,.4);
}
.nav-container {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 72px; gap: 24px;
}
.nav-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.nav-logo-icon {
  width: 40px; height: 40px; background: var(--gold); border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 14px; color: #fff; flex-shrink: 0;
}
.nav-logo-name { font-size: 19px; font-weight: 700; color: var(--gold); letter-spacing: 0.05em; }
.nav-logo-sub  { font-size: 9px; color: rgba(255,255,255,.45); letter-spacing: 2px; text-transform: uppercase; }
.nav-links { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: center; }
.nav-lnk {
  padding: 8px 16px; border-radius: 8px;
  font-size: 14px; font-weight: 500; color: rgba(255,255,255,.65);
  transition: all .2s;
}
.nav-lnk:hover { color: var(--gold); background: rgba(26,61,143,.1); }
.nav-lnk.active { color: var(--gold); }
.nav-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
.hamburger span { display: block; width: 24px; height: 2px; background: rgba(255,255,255,.8); border-radius: 2px; transition: all .3s; }
.hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ══════════════════════════════════
   HERO
══════════════════════════════════ */
.hero-section {
  min-height: 88vh;
  position: relative;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  --hero-tint: linear-gradient(160deg, rgba(0,0,0,.88) 0%, rgba(8,14,30,.8) 50%, rgba(0,0,0,.92) 100%);
  background-color: #06101f;
  background-image: var(--hero-tint),
    url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=1600&q=72');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 80px 24px 60px;
  text-align: center;
}
/* الشاشة الصغيرة تطلب مقاس الشاشة الصغيرة. النسخة العريضة كانت سبعمئة كيلوبايت
   تنزل على جوال عرضه اربعمئة بكسل، وهي خلف تدرج معتم يخفي تسعة اعشار تفاصيلها. */
@media (max-width: 600px) {
  .hero-section {
    background-image: var(--hero-tint),
      url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=640&q=60');
  }
}
@media (min-width: 601px) and (max-width: 1100px) {
  .hero-section {
    background-image: var(--hero-tint),
      url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=1200&q=68');
  }
}
.hero-section::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 30%, rgba(26,61,143,.07) 0%, transparent 65%);
  pointer-events: none;
}
.hero-section__content { position: relative; z-index: 2; max-width: 860px; margin: 0 auto; }
.hero-section__badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(26,61,143,.12); border: 1px solid rgba(26,61,143,.3);
  color: rgba(126,200,248,.9); padding: 7px 20px; border-radius: 24px;
  font-size: 12px; font-weight: 500; margin-bottom: 28px;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.badge-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold); box-shadow: 0 0 8px var(--gold);
  animation: blink 2s infinite;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }
.hero-section__title { color: #fff; margin-bottom: 20px; font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; }
.hero-section__title--gold { color: var(--gold); display: block; font-weight: 300; }
.hero-section__desc { font-size: 16px; color: rgba(255,255,255,.5); max-width: 560px; margin: 0 auto 40px; line-height: 1.9; font-weight: 400; }
.hero-section__cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 60px; }
.hero-stats-bar {
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px; padding: 20px 10px; backdrop-filter: blur(8px);
  max-width: 580px; margin: 0 auto; flex-wrap: wrap;
  position: relative; z-index: 4;
}
.hero-stat-item { flex: 1; min-width: 90px; text-align: center; padding: 4px 16px; }
.hero-stat-divider { width: 1px; height: 36px; background: rgba(255,255,255,.15); flex-shrink: 0; }
.hero-stat-item__num { font-size: 1.8rem; font-weight: 700; color: var(--gold); line-height: 1; margin-bottom: 4px; }
.hero-stat-item__lbl { font-size: 11px; color: rgba(255,255,255,.45); font-weight: 400; letter-spacing: 0.03em; }
.hero-section__scroll {
  position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: rgba(255,255,255,.35); font-size: 11px; letter-spacing: 1px;
}
.scroll-icon {
  width: 18px; height: 18px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  animation: arrowBounce 2s infinite;
}
@keyframes arrowBounce { 0%,100%{transform:rotate(45deg) translateY(0)} 50%{transform:rotate(45deg) translateY(5px)} }

/* ══ MARQUEE ══ */
.marquee-strip { background: var(--gold); padding: 13px 0; overflow: hidden; white-space: nowrap; }
.marquee-track {
  display: inline-flex; gap: 52px;
  animation: marqueeAnim 28s linear infinite;
  font-size: 12px; font-weight: 500; letter-spacing: 3px; color: var(--black);
  text-transform: uppercase;
}
@keyframes marqueeAnim { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ══════════════════════════════════
   SECTION COMMONS
══════════════════════════════════ */
.sec-header { text-align: center; margin-bottom: 40px; }
.sec-tag {
  display: inline-block; font-size: 10px; font-weight: 600;
  letter-spacing: 4px; text-transform: uppercase; color: var(--gold); margin-bottom: 16px;
  opacity: 0.85;
}
.sec-title { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 700; color: var(--text); margin-bottom: 14px; letter-spacing: -0.01em; line-height: 1.3; }
.sec-sub { color: var(--text3); font-size: 15px; max-width: 500px; margin: 0 auto; font-weight: 400; line-height: 1.8; }

/* ══════════════════════════════════
   ABOUT INTRO
══════════════════════════════════ */
.about-intro { padding: 68px 0; background: #fff; }
.about-intro__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.about-intro__title { font-size: clamp(1.5rem, 2.8vw, 2.1rem); font-weight: 700; margin-bottom: 18px; line-height: 1.4; color: var(--text); letter-spacing: -0.01em; }
.about-intro__desc { color: var(--text3); font-size: 15px; line-height: 1.95; margin-bottom: 28px; font-weight: 400; }
.about-vals { display: flex; flex-direction: column; gap: 10px; margin-bottom: 32px; }
.about-val { display: flex; align-items: flex-start; gap: 14px; padding: 14px 18px; background: #fff; border-radius: 12px; border: 1px solid var(--border); }
.about-val__ico { color: var(--gold); font-size: 14px; margin-top: 3px; flex-shrink: 0; }
.about-val__title { font-size: 14px; font-weight: 600; margin-bottom: 2px; }
.about-val__sub { font-size: 12px; color: var(--text3); font-weight: 400; }
.about-intro__visual { position: relative; }
.about-img {
  width: 100%; aspect-ratio: 4/5;
  background:
    linear-gradient(180deg, rgba(0,0,0,.3) 0%, rgba(0,0,0,.6) 100%),
    url('https://images.unsplash.com/photo-1486325212027-8081e485255e?w=800&q=80') center/cover no-repeat;
  border-radius: 20px; overflow: hidden;
  display: flex; align-items: flex-end; padding: 24px;
  box-shadow: var(--shadow-lg);
}
.about-img__stat { background: rgba(26,61,143,.9); color: #fff; border-radius: 12px; padding: 14px 20px; }
.about-img__stat-num { font-size: 2.2rem; font-weight: 900; line-height: 1; }
.about-img__stat-lbl { font-size: 12px; font-weight: 600; opacity: .9; }
.about-img__badge {
  position: absolute; top: 24px; left: -20px;
  background: #fff; border-radius: 14px; padding: 12px 16px;
  display: flex; align-items: center; gap: 10px;
  box-shadow: var(--shadow-lg); min-width: 160px;
}
.aib__ico { font-size: 24px; }
.aib__title { font-size: 13px; font-weight: 700; }
.aib__sub { font-size: 11px; color: var(--text3); }

/* ══════════════════════════════════
   PROPERTIES
══════════════════════════════════ */
.props-section { padding: 68px 0; background: var(--light); }
.props-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.prop-card { background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--border); transition: all .3s; }
.prop-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.prop-card__img { height: 210px; position: relative; overflow: hidden; }
.prop-card__img--m { background: linear-gradient(135deg, #0f2440 0%, #1a3a5c 100%); }
.prop-card__img--j { background: linear-gradient(135deg, #0d2e19 0%, #1a4a2a 100%); }
.prop-card__img--a { background: linear-gradient(135deg, #2e1f00 0%, #4a3200 100%); }
.prop-card__img--w { background: linear-gradient(135deg, #200d00 0%, #3a1500 100%); }
.prop-card__badge { position: absolute; top: 12px; right: 12px; background: var(--gold); color: #fff; border-radius: 20px; padding: 4px 12px; font-size: 11px; font-weight: 500; letter-spacing: 0.03em; }
.prop-card__overlay { position: absolute; inset: 0; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s; }
.prop-card:hover .prop-card__overlay { opacity: 1; }
.prop-card__cta-btn { background: var(--gold); color: #fff; padding: 10px 22px; border-radius: 8px; font-size: 13px; font-weight: 700; transform: translateY(10px); transition: transform .3s; }
.prop-card:hover .prop-card__cta-btn { transform: translateY(0); }
.prop-card__body { padding: 18px; }
.prop-tag { display: inline-block; font-size: 10px; font-weight: 500; color: var(--gold); background: var(--gold-muted); border: 1px solid rgba(26,61,143,.2); border-radius: 20px; padding: 3px 10px; margin-bottom: 8px; letter-spacing: 1px; text-transform: uppercase; }
.prop-tag--luxury { color: #7D6608; background: rgba(125,102,8,.07); border-color: rgba(125,102,8,.2); }
.prop-tag--family { color: #6E2F00; background: rgba(110,47,0,.07); border-color: rgba(110,47,0,.2); }
.prop-card__name { font-size: 16px; font-weight: 700; margin-bottom: 3px; letter-spacing: -0.01em; }
.prop-card__en { font-size: 11px; color: var(--text3); margin-bottom: 12px; font-weight: 400; letter-spacing: 0.03em; }
.prop-card__meta { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--text3); margin-bottom: 14px; font-weight: 400; }
.prop-card__meta span { display: flex; align-items: center; gap: 5px; }

/* ══════════════════════════════════
   SERVICES
══════════════════════════════════ */
.services-section { padding: 68px 0; background: var(--dark); }
.services-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.service-card { background: var(--dark2); border: 1px solid var(--border-dark); border-radius: var(--radius); padding: 32px 24px; text-align: center; transition: all .3s; }
.service-card:hover { background: var(--dark3); border-color: rgba(26,61,143,.4); transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,.35); }
.service-card__ico { width: 60px; height: 60px; background: var(--gold-muted); border-radius: 14px; display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; color: var(--gold); border: 1px solid rgba(26,61,143,.25); transition: all .3s; }
.service-card:hover .service-card__ico { background: var(--gold); color: #fff; border-color: var(--gold); }
.service-card h3 { color: #fff; margin-bottom: 10px; font-size: 15px; font-weight: 600; }
.service-card p { font-size: 13px; color: rgba(255,255,255,.42); line-height: 1.9; font-weight: 400; }

/* ══════════════════════════════════
   NUMBERS
══════════════════════════════════ */
.numbers-section { padding: 68px 0; background: var(--gold); }
.numbers-grid { display: grid; grid-template-columns: repeat(3,1fr); text-align: center; }
.number-item { padding: 10px 20px; position: relative; }
.number-item:not(:last-child)::after { content: ''; position: absolute; top: 10%; left: 0; height: 80%; width: 1px; background: rgba(0,0,0,.18); }
.number-item__val { font-size: 2.8rem; font-weight: 700; color: #fff; line-height: 1; margin-bottom: 8px; letter-spacing: -0.02em; }
.number-item__lbl { font-size: 13px; font-weight: 400; color: rgba(255,255,255,.6); letter-spacing: 0.02em; }

/* ══════════════════════════════════
   CTA SECTION
══════════════════════════════════ */
.cta-section {
  padding: 68px 0;
  --cta-tint: linear-gradient(135deg, rgba(0,0,0,.92) 0%, rgba(8,14,30,.88) 100%);
  background-color: #050a14;
  background-image: var(--cta-tint),
    url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=1600&q=70');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
@media (max-width: 600px) {
  .cta-section {
    background-image: var(--cta-tint),
      url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=640&q=60');
  }
}
.cta-section__inner { text-align: center; }
.cta-section__deco { width: 56px; height: 2px; background: var(--gold); margin: 0 auto 28px; border-radius: 2px; }
.cta-section__title { color: #fff; font-size: clamp(1.5rem, 2.8vw, 2.1rem); font-weight: 700; margin-bottom: 16px; letter-spacing: -0.01em; }
.cta-section__sub { color: rgba(255,255,255,.48); font-size: 15px; max-width: 480px; margin: 0 auto 40px; line-height: 1.9; font-weight: 400; }
.cta-section__btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ══════════════════════════════════
   FOOTER (New Homepage)
══════════════════════════════════ */
.site-footer-new { background: var(--black); padding: 72px 0 0; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 48px; padding-bottom: 56px; border-bottom: 1px solid var(--border-dark); }
.footer-brand__logo { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.footer-brand__desc { font-size: 13px; color: rgba(255,255,255,.42); line-height: 1.95; margin-bottom: 20px; }
.footer-col { display: flex; flex-direction: column; gap: 10px; }
.footer-col__title { font-size: 10px; font-weight: 600; color: var(--gold); letter-spacing: 3px; text-transform: uppercase; margin-bottom: 10px; opacity: 0.85; }
.footer-col a { font-size: 13px; color: rgba(255,255,255,.42); transition: color .15s; font-weight: 400; }
.footer-col a:hover { color: var(--gold); }
.footer-social { display: flex; gap: 8px; }
.social-btn { width: 36px; height: 36px; border-radius: 8px; background: rgba(255,255,255,.05); border: 1px solid var(--border-dark); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.45); transition: all .2s; }
.social-btn:hover { background: var(--gold); color: #fff; border-color: var(--gold); }
.footer-bottom { padding: 20px 0; display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: rgba(255,255,255,.28); flex-wrap: wrap; gap: 10px; }
.footer-bottom__admin { color: rgba(255,255,255,.2); transition: color .15s; }
.footer-bottom__admin:hover { color: var(--gold); }

/* ══════════════════════════════════
   ABOUT PAGE
══════════════════════════════════ */
.about-hero {
  min-height: 52vh; position: relative;
  display: flex; align-items: center; justify-content: center;
  background:
    linear-gradient(160deg, rgba(0,0,0,.82) 0%, rgba(8,6,1,.78) 100%),
    url('https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=1920&q=80') center/cover no-repeat;
  text-align: center; padding: 120px 24px 72px;
}
.about-hero__content { position: relative; z-index: 2; }
.about-hero__title { color: #fff; font-size: clamp(2rem,4.5vw,3.4rem); font-weight: 900; margin: 12px 0 16px; }
.about-hero__sub { color: rgba(255,255,255,.6); font-size: 16px; }

.about-svc-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 32px 28px; transition: all .3s; }
.about-svc-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: rgba(26,61,143,.4); }
.about-svc-card--featured { background: var(--dark); border-color: var(--gold); }
.about-svc-card--featured h3 { color: #fff; }
.about-svc-card--featured p { color: rgba(255,255,255,.55); }
.about-svc-card--featured .about-svc-card__list li { color: rgba(255,255,255,.65); border-color: rgba(255,255,255,.1); }
.about-svc-card__ico { font-size: 2.4rem; margin-bottom: 16px; }
.about-svc-card h3 { font-size: 17px; margin-bottom: 10px; }
.about-svc-card p { font-size: 13px; color: var(--text2); line-height: 1.85; margin-bottom: 18px; }
.about-svc-card__list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.about-svc-card__list li { font-size: 13px; color: var(--text2); padding: 6px 0; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px; }
.about-svc-card__list li::before { content: '✦'; color: var(--gold); font-size: 10px; flex-shrink: 0; }

.vmv-card { background: var(--dark2); border: 1px solid var(--border-dark); border-radius: var(--radius); padding: 32px 28px; transition: all .3s; }
.vmv-card:hover { border-color: rgba(26,61,143,.35); transform: translateY(-3px); }
.vmv-card--gold { background: var(--gold); border-color: var(--gold); }
.vmv-card--gold .vmv-card__tag { color: rgba(0,0,0,.6); }
.vmv-card--gold h3, .vmv-card--gold p { color: var(--black); }
.vmv-card__ico { font-size: 2.2rem; margin-bottom: 14px; }
.vmv-card__tag { font-size: 10px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.vmv-card h3 { font-size: 16px; font-weight: 800; color: #fff; margin-bottom: 10px; }
.vmv-card p { font-size: 13px; color: rgba(255,255,255,.5); line-height: 1.85; }

.team-card { background: var(--light); border: 1px solid var(--border); border-radius: var(--radius); padding: 28px 20px; text-align: center; transition: all .3s; }
.team-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.team-card__avatar { width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 900; color: #fff; margin: 0 auto 14px; }
.team-card__name { font-size: 16px; font-weight: 800; margin-bottom: 4px; }
.team-card__role { font-size: 12px; color: var(--gold); font-weight: 700; margin-bottom: 10px; letter-spacing: .5px; }
.team-card__desc { font-size: 12px; color: var(--text3); line-height: 1.75; }

/* ══════════════════════════════════
   OLD PAGES (apartments, inquiry, login)
   — keep existing classes intact
══════════════════════════════════ */
h1 { font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 800; line-height: 1.2; }
h2 { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 700; }
h3 { font-size: 1.15rem; font-weight: 700; }

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.96); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); }
.header-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo { display: flex; align-items: center; gap: 10px; }
.logo-ico { width: 38px; height: 38px; background: var(--gold); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: #fff; }
.logo-name { font-size: 18px; font-weight: 800; color: var(--gold); }
.logo-sub { font-size: 9px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 6px; }
.nav-link { padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--text2); transition: all .15s; }
.nav-link:hover { background: var(--light); color: var(--text); }
.nav-link.active { color: var(--gold); background: rgba(26,61,143,.08); }

.section { padding: 72px 24px; }
.section-inner { max-width: 1200px; margin: 0 auto; }
.section-hd { text-align: center; margin-bottom: 48px; }
.section-label { font-size: 11px; font-weight: 700; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.section-title { margin-bottom: 12px; }
.section-sub { color: var(--text2); font-size: 15px; max-width: 520px; margin: 0 auto; }
.section-alt { background: var(--light); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

.buildings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.building-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: all .2s; }
.building-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.building-card-hd { padding: 18px 20px; color: #fff; }
.bc-m { background: linear-gradient(135deg,#1A5276,#154360); }
.bc-j { background: linear-gradient(135deg,#1A7340,#145A32); }
.bc-a { background: linear-gradient(135deg,#7D6608,#6E5A06); }
.bc-w { background: linear-gradient(135deg,#6E2F00,#5C2700); }
.building-card-hd h3 { font-size: 17px; }
.building-card-hd span { font-size: 12px; opacity: .7; }
.building-card-body { padding: 16px 20px; }
.bc-row { display: flex; justify-content: space-between; font-size: 13px; padding: 5px 0; border-bottom: 1px solid var(--border); }
.bc-row:last-child { border-bottom: none; }
.bc-row b { color: var(--gold); }
.bc-cta { padding: 12px 20px; border-top: 1px solid var(--border); }
.bc-cta a { display: flex; align-items: center; justify-content: center; gap: 6px; background: rgba(26,61,143,.08); color: var(--gold); border: 1px solid rgba(26,61,143,.25); border-radius: 8px; padding: 9px; font-size: 13px; font-weight: 600; transition: all .15s; }
.bc-cta a:hover { background: var(--gold); color: #fff; }

.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.feature-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 28px 24px; text-align: center; }
.feature-ico { font-size: 2.4rem; margin-bottom: 14px; }
.feature-card h3 { margin-bottom: 8px; }
.feature-card p { font-size: 13px; color: var(--text2); line-height: 1.7; }

.cta-banner { background: linear-gradient(135deg,#111 0%,#0a1428 100%); color: #fff; text-align: center; padding: 72px 24px; }
.cta-banner h2 { margin-bottom: 12px; color: #fff; }
.cta-banner p { color: rgba(255,255,255,.6); margin-bottom: 32px; font-size: 15px; }

.page-hero { background: var(--light); border-bottom: 1px solid var(--border); padding: 40px 24px; }
.page-hero-inner { max-width: 900px; margin: 0 auto; }
.page-hero h1 { font-size: 2rem; margin-bottom: 6px; }
.page-hero p { color: var(--text2); }
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; }
.filter-btn { padding: 8px 18px; border-radius: 20px; border: 1px solid var(--border); background: #fff; font-size: 13px; font-weight: 500; cursor: pointer; transition: all .15s; font-family: inherit; color: var(--text2); }
.filter-btn:hover { border-color: var(--gold); color: var(--gold); }
.filter-btn.active { background: var(--gold); color: #fff; border-color: var(--gold); }
.apt-section { margin-bottom: 36px; }
.apt-section-hd { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 12px 18px; border-radius: 10px; color: #fff; }
.apt-section-hd.m { background: linear-gradient(90deg,#1A5276,#154360); }
.apt-section-hd.j { background: linear-gradient(90deg,#1A7340,#145A32); }
.apt-section-hd.a { background: linear-gradient(90deg,#7D6608,#6E5A06); }
.apt-section-hd.w { background: linear-gradient(90deg,#6E2F00,#5C2700); }
.apt-section-hd h3 { font-size: 15px; }
.apt-section-hd span { opacity: .7; font-size: 12px; }
.apt-section-hd .apt-count { margin-right: auto; background: rgba(255,255,255,.2); padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 700; }
.apt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.apt-card { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 14px; text-align: center; transition: all .15s; }
.apt-card:hover { border-color: var(--gold); box-shadow: 0 4px 12px rgba(26,61,143,.15); transform: translateY(-2px); }
.apt-num { font-size: 1.4rem; font-weight: 800; color: var(--gold); }
.apt-floor { font-size: 10px; color: var(--text3); margin: 3px 0 10px; }
.apt-status { font-size: 11px; font-weight: 600; color: var(--green); background: rgba(26,115,64,.08); border: 1px solid rgba(26,115,64,.2); border-radius: 20px; padding: 2px 8px; display: inline-block; margin-bottom: 10px; }
.apt-card a { display: block; background: rgba(26,61,143,.08); color: var(--gold); border: 1px solid rgba(26,61,143,.2); border-radius: 6px; padding: 5px; font-size: 11px; font-weight: 600; transition: all .15s; }
.apt-card a:hover { background: var(--gold); color: #fff; }
.empty-state { text-align: center; padding: 60px 24px; color: var(--text3); }
.empty-state .ico { font-size: 3rem; margin-bottom: 12px; }
.empty-state p { font-size: 15px; }

.form-wrap { max-width: 680px; margin: 0 auto; }
.form-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 36px; box-shadow: var(--shadow); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-full { grid-column: 1 / -1; }
.form-group label { display: block; font-size: 12px; font-weight: 600; color: var(--text2); margin-bottom: 6px; }
.form-group input, .form-group select, .form-group textarea { width: 100%; background: var(--light); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; font-size: 14px; font-family: inherit; color: var(--text); outline: none; transition: border .15s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--gold); background: #fff; }
.form-group textarea { resize: vertical; min-height: 100px; }
.form-submit { margin-top: 8px; width: 100%; justify-content: center; font-size: 15px; padding: 14px; }
.success-box { background: rgba(26,115,64,.08); border: 1px solid rgba(26,115,64,.25); border-radius: 12px; padding: 32px; text-align: center; }
.success-box .ico { font-size: 3rem; margin-bottom: 12px; }
.success-box h3 { color: var(--green); margin-bottom: 8px; }
.success-box p { color: var(--text2); font-size: 14px; }

.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--dark); padding: 24px; position: relative; overflow: hidden; }
.login-bg-logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: .18; pointer-events: none; user-select: none; }
.login-card { background: #1a1a1a; border: 1px solid #333; border-radius: 16px; padding: 40px; width: 100%; max-width: 360px; }
.login-logo { text-align: center; margin-bottom: 32px; }
.login-logo .ico { width: 54px; height: 54px; background: var(--gold); border-radius: 14px; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 20px; color: #fff; margin: 0 auto 10px; }
.login-logo h2 { color: var(--gold); font-size: 20px; }
.login-logo p { color: #666; font-size: 12px; }
.login-group { margin-bottom: 16px; }
.login-group label { display: block; font-size: 11px; font-weight: 600; color: #888; margin-bottom: 6px; letter-spacing: .5px; text-transform: uppercase; }
.login-group input { width: 100%; background: #111; border: 1px solid #333; border-radius: 8px; padding: 12px 14px; font-size: 15px; font-family: inherit; color: #fff; outline: none; transition: border .15s; }
.login-group input:focus { border-color: var(--gold); }
.login-btn { width: 100%; background: var(--gold); color: #fff; border: none; border-radius: 8px; padding: 13px; font-size: 15px; font-weight: 700; cursor: pointer; margin-top: 8px; font-family: inherit; transition: background .15s; }
.login-btn:hover { background: var(--gold-light); }
.login-error { background: rgba(192,57,43,.15); border: 1px solid rgba(192,57,43,.3); color: #e74c3c; border-radius: 8px; padding: 10px 14px; font-size: 13px; margin-bottom: 14px; text-align: center; }

.site-footer { background: var(--dark); color: rgba(255,255,255,.5); text-align: center; padding: 24px; font-size: 13px; }
.site-footer a { color: var(--gold-light); }
.text-gold { color: var(--gold); }
.badge-free { display: inline-block; background: rgba(26,115,64,.1); color: var(--green); border: 1px solid rgba(26,115,64,.2); border-radius: 20px; font-size: 11px; font-weight: 600; padding: 2px 10px; }

/* ══════════════════════════════════
   RESPONSIVE
══════════════════════════════════ */
@media (max-width: 1024px) {
  .props-grid     { grid-template-columns: repeat(2,1fr); }
  .services-grid  { grid-template-columns: repeat(2,1fr); }
  .footer-grid    { grid-template-columns: 1fr 1fr; gap: 32px; }
  .about-intro__grid { gap: 48px; }
}
@media (max-width: 768px) {
  .nav-links { display: none; position: fixed; top: 72px; right: 0; left: 0; background: rgba(8,8,8,.98); flex-direction: column; padding: 16px 24px 24px; gap: 4px; border-bottom: 1px solid var(--border-dark); z-index: 199; }
  .nav-links.open { display: flex; }
  .hamburger { display: flex; }
  .hero-section { min-height: 90vh; }
  .hero-stats-bar { padding: 14px 6px; }
  .hero-stat-item { min-width: 75px; padding: 4px 8px; }
  .hero-stat-item__num { font-size: 1.5rem; }
  .about-intro__grid { grid-template-columns: 1fr; gap: 36px; }
  .about-intro__visual { display: none; }
  .numbers-grid { grid-template-columns: 1fr 1fr; }
  .number-item:nth-child(2)::after { display: none; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .site-nav .nav-link:not(.btn) { display: none; }
  .form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .props-grid { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr; }
  .hero-section__cta { flex-direction: column; align-items: center; }
  .hero-stat-divider { display: none; }
  .cta-section__btns { flex-direction: column; align-items: center; }
  .form-card { padding: 24px 18px; }
  .buildings-grid { grid-template-columns: 1fr; }
}

/* ── Hero Property Type Pills ─────────────────────────────── */
.hero-type-pill {
  padding: 8px 18px; border-radius: 30px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
  color: #fff; font-family: 'Cairo', sans-serif; font-size: 13px; font-weight: 600;
  text-decoration: none; backdrop-filter: blur(6px); transition: all .2s;
}
.hero-type-pill:hover {
  background: rgba(26,61,143,.6); border-color: #2a5cc7;
}

/* ── Category Tabs ────────────────────────────────────────── */
.cat-tabs-bar { background:var(--dark);padding:0; }
.cat-tabs { display:flex;gap:0; }
.cat-tab { display:flex;align-items:center;gap:10px;padding:20px 28px;text-decoration:none;color:rgba(255,255,255,.5);font-size:14px;font-weight:600;border-bottom:3px solid transparent;transition:all .2s;flex:1;justify-content:center; }
.cat-tab:hover { color:rgba(255,255,255,.85);background:rgba(255,255,255,.04); }
.cat-tab.active { color:#fff;border-bottom-color:var(--gold);background:rgba(26,61,143,.08); }
.cat-tab__ico { font-size:1.3rem; }
.cat-tab__lbl { font-weight:700; }
.cat-tab__count { background:rgba(255,255,255,.12);color:rgba(255,255,255,.6);font-size:11px;padding:2px 8px;border-radius:20px;font-weight:600; }
.cat-tab.active .cat-tab__count { background:rgba(26,61,143,.25);color:var(--gold); }
@media (max-width:600px) {
  .cat-tab { padding:14px 12px;flex-direction:column;gap:4px;font-size:12px; }
  .cat-tab__ico { font-size:1.1rem; }
}

/* ── Listings Marketplace ─────────────────────────────────── */
.listings-filter-bar { background:#fff;border-bottom:1px solid var(--border);padding:16px 0;position:sticky;top:72px;z-index:90; }
.listings-filter-form { display:flex;align-items:center;gap:24px;flex-wrap:wrap; }
.lf-group { display:flex;flex-direction:column;gap:6px; }
.lf-lbl { font-size:11px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.05em; }
.lf-select { background:var(--light);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-family:inherit;font-size:13px;color:var(--dark);outline:none;cursor:pointer; }
.lf-select:focus { border-color:var(--gold); }
.lf-tabs { display:flex;gap:4px; }
.lf-tab { padding:7px 16px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none;color:var(--text3);background:var(--light);border:1px solid var(--border);transition:all .15s; }
.lf-tab.active { background:var(--gold);color:#fff;border-color:var(--gold); }
.lf-count { padding:8px 0; }
input[type="number"].lf-select { -moz-appearance:textfield; }
input[type="number"].lf-select::-webkit-outer-spin-button,
input[type="number"].lf-select::-webkit-inner-spin-button { -webkit-appearance:none; }

.listing-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px; }
.listing-card { background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s;display:flex;flex-direction:column; }
.listing-card:hover { box-shadow:0 12px 40px rgba(0,0,0,.1);transform:translateY(-4px); }
.listing-card__photo { aspect-ratio:4/3;position:relative;overflow:hidden;background:var(--dark); }
.listing-card__photo img { width:100%;height:100%;object-fit:cover;transition:transform .4s; }
.listing-card:hover .listing-card__photo img { transform:scale(1.05); }
.listing-card__photo-ph { width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:3rem;background:linear-gradient(135deg,#0f1a2e,#1a2d4a); }
.listing-card__badges { position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:5px;align-items:flex-end; }
.lc-badge { padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700; }
.lc-badge--featured { background:var(--gold);color:#fff; }
.lc-badge--type { background:rgba(0,0,0,.55);color:#fff;backdrop-filter:blur(4px); }
.listing-card__body { padding:16px;flex:1;display:flex;flex-direction:column;gap:6px; }
.listing-card__building { font-size:11px;color:var(--gold);font-weight:700;text-transform:uppercase;letter-spacing:.05em; }
.listing-card__title { font-size:15px;font-weight:700;line-height:1.4;color:var(--dark); }
.listing-card__meta { display:flex;gap:12px;font-size:12px;color:var(--text3);flex-wrap:wrap;margin-top:2px; }
.listing-card__footer { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:12px;border-top:1px solid var(--border); }
.listing-card__price .lcp-num { font-size:1.2rem;font-weight:800;color:var(--dark); }
.listing-card__price .lcp-unit { font-size:12px;color:var(--text3); }
.listing-card__cta { font-size:13px;font-weight:600;color:var(--gold); }

/* Listing Detail */
.listing-gallery-section { background:#fff;padding:24px 0 0;border-bottom:1px solid var(--border); }
.listing-gallery { display:flex;flex-direction:column;gap:8px;max-height:520px; }
.listing-gallery__main { border-radius:16px;overflow:hidden;background:var(--dark);aspect-ratio:16/7;max-height:380px; }
.listing-gallery__main img { width:100%;height:100%;object-fit:cover;display:block; }
.listing-gallery__thumbs { display:flex;gap:8px;padding-bottom:16px;overflow-x:auto; }
.listing-gallery__thumb { width:80px;height:60px;border-radius:8px;overflow:hidden;cursor:pointer;flex-shrink:0;border:2px solid transparent;opacity:.7;transition:all .15s; }
.listing-gallery__thumb.active { border-color:var(--gold);opacity:1; }
.listing-gallery__thumb img { width:100%;height:100%;object-fit:cover; }
.listing-gallery__placeholder { background:linear-gradient(135deg,#0f1a2e,#1a2d4a);border-radius:16px;height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin-bottom:16px; }
.listing-gallery__placeholder span { font-size:4rem; }
.listing-gallery__placeholder p { color:rgba(255,255,255,.4);font-size:14px; }

.listing-layout { display:grid;grid-template-columns:1fr 400px;gap:48px;align-items:start; }
.listing-info { min-width:0; }
.listing-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px; }
.listing-stat { background:var(--light);border-radius:12px;padding:14px;text-align:center; }
.listing-stat__val { font-size:1.5rem;font-weight:800;color:var(--dark); }
.listing-stat__lbl { font-size:11px;color:var(--text3);margin-top:2px; }
.listing-divider { height:1px;background:var(--border);margin:24px 0; }
.listing-amenities { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }
.listing-amenity { display:flex;align-items:center;gap:8px;font-size:13px;padding:10px 12px;background:var(--light);border-radius:10px; }

.listing-book-box { background:#fff;border:1px solid var(--border);border-radius:20px;padding:24px;position:sticky;top:96px;box-shadow:0 8px 32px rgba(0,0,0,.08); }
.lbb-price { margin-bottom:16px; }
.lbb-price__num { font-size:2rem;font-weight:900;color:var(--dark); }
.lbb-price__unit { font-size:14px;color:var(--text3); }
.lbb-toggle { display:flex;gap:4px;background:var(--light);border-radius:10px;padding:4px;margin-bottom:16px; }
.lbb-toggle__btn { flex:1;padding:8px;border:none;border-radius:8px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;background:transparent;color:var(--text3);transition:all .15s; }
.lbb-toggle__btn.active { background:#fff;color:var(--dark);box-shadow:0 1px 4px rgba(0,0,0,.1); }
.lbb-row { margin-bottom:12px; }
.lbb-lbl { display:block;font-size:11px;color:var(--text3);font-weight:600;margin-bottom:5px; }
.lbb-inp { width:100%;background:var(--light);border:1px solid var(--border);border-radius:8px;padding:9px 12px;font-family:inherit;font-size:13px;outline:none;color:var(--dark); }
.lbb-inp:focus { border-color:var(--gold); }
.lbb-total { background:var(--light);border-radius:10px;padding:12px 14px;margin-top:12px; }
.lbb-total__row { display:flex;justify-content:space-between;font-size:12px;color:var(--text3);margin-bottom:6px; }
.lbb-total__sum { display:flex;justify-content:space-between;font-size:14px;font-weight:700; }
.lbb-wa { display:flex;align-items:center;justify-content:center;gap:8px;background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;border-radius:10px;padding:10px;font-size:13px;font-weight:600;text-decoration:none;margin-top:8px;transition:background .15s; }
.lbb-wa:hover { background:#dcfce7; }

/* Booking Form */
.book-listing-preview { display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:20px;text-decoration:none;color:inherit;transition:border-color .15s; }
.book-listing-preview:hover { border-color:var(--gold); }
.book-listing-preview__photo { width:80px;height:64px;border-radius:10px;overflow:hidden;flex-shrink:0;background:var(--dark); }
.book-listing-preview__photo img { width:100%;height:100%;object-fit:cover; }
.book-listing-preview__info { flex:1;min-width:0; }
.book-form-card { background:#fff;border:1px solid var(--border);border-radius:20px;padding:28px; }
.book-form-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:0; }
.book-full { grid-column:1/-1; }
.book-divider { height:1px;background:var(--border);margin:20px 0; }
.book-type-toggle { display:flex;gap:12px;flex-wrap:wrap; }
.book-type-opt { cursor:pointer; }
.book-type-opt input { display:none; }
.book-type-opt__label { display:flex;align-items:center;gap:10px;padding:12px 16px;border:2px solid var(--border);border-radius:12px;transition:all .15s;font-size:14px; }
.book-type-opt input:checked + .book-type-opt__label { border-color:var(--gold);background:rgba(26,61,143,.06); }
.book-type-opt__ico { font-size:1.3rem; }
.book-type-opt__label strong { display:block;font-weight:700; }
.book-type-opt__label small { display:block;color:var(--text3);font-size:12px;margin-top:2px; }
.book-total-box { background:var(--light);border-radius:10px;padding:12px 14px;margin-bottom:16px; }

/* Success Page */
.book-success-card { background:#fff;border:1px solid var(--border);border-radius:20px;padding:40px;text-align:center; }
.book-success-card__icon { font-size:4rem;margin-bottom:16px;display:block; }
.book-success-ref { background:var(--light);border:1px dashed var(--border);border-radius:10px;padding:12px 20px;margin:0 auto;display:inline-block; }

@media (max-width: 1024px) {
  .listing-grid { grid-template-columns:repeat(2,1fr); }
  .listing-layout { grid-template-columns:1fr; }
  .listing-book-box { position:static; }
}
@media (max-width: 600px) {
  .listing-grid { grid-template-columns:1fr; }
  .listing-stats { grid-template-columns:repeat(2,1fr); }
  .listing-amenities { grid-template-columns:repeat(2,1fr); }
  .book-form-grid { grid-template-columns:1fr; }
  .book-type-toggle { flex-direction:column; }
  .lf-tabs { flex-wrap:wrap; }
}

/* ── Contact Option Cards (inquiry page) ──────────────────── */
.contact-option-card {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 16px;
  padding: 24px 28px;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .2s, border-color .2s, transform .2s;
  cursor: pointer;
}
.contact-option-card:hover {
  border-color: var(--gold);
  box-shadow: 0 8px 32px rgba(26,61,143,.15);
  transform: translateY(-2px);
}
.contact-option-card__ico {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.contact-option-card__text {
  flex: 1;
}
.contact-option-card__title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text3);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.contact-option-card__val {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--dark);
  margin-bottom: 4px;
  direction: ltr;
  text-align: right;
}
.contact-option-card__hint {
  font-size: 13px;
  color: var(--text3);
}
.contact-option-card__arrow {
  font-size: 1.4rem;
  color: var(--gold);
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════
   CLIENT SIDEBAR LAYOUT
══════════════════════════════════════════════ */
body.csb-layout {
  display: flex;
  min-height: 100vh;
  overflow-x: hidden;
}
.client-sidebar {
  width: 232px;
  flex-shrink: 0;
  background: linear-gradient(180deg, #0D1B2E 0%, #091526 100%);
  border-left: 1px solid rgba(255,255,255,.06);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  z-index: 100;
}
.csb-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 18px 18px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  flex-shrink: 0;
}
.csb-logo img { filter: brightness(0) invert(1); }
.csb-logo .nav-logo-sub { color: rgba(255,255,255,.35); }
.csb-nav {
  flex: 1;
  padding: 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
}
.csb-lnk {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-radius: 10px;
  color: rgba(255,255,255,.42);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  transition: background .2s, color .2s;
  position: relative;
}
.csb-lnk:hover { background: rgba(255,255,255,.07); color: rgba(255,255,255,.85); }
.csb-lnk.active {
  background: linear-gradient(270deg, rgba(59,130,246,.28) 0%, rgba(59,130,246,.08) 100%);
  color: #93c5fd;
}
.csb-lnk.active::after {
  content: '';
  position: absolute;
  right: 0; top: 12%; bottom: 12%;
  width: 3px;
  border-radius: 2px 0 0 2px;
  background: linear-gradient(180deg, #60a5fa, #2563eb);
  box-shadow: 0 0 8px rgba(96,165,250,.9), 0 0 18px rgba(96,165,250,.35);
}
.csb-ico { font-size: 16px; width: 22px; text-align: center; flex-shrink: 0; color: inherit; }
.csb-divider { height: 1px; background: rgba(255,255,255,.07); margin: 6px 8px; }
.csb-sub {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding-right: 44px;
  margin-bottom: 4px;
}
.csb-sublnk {
  color: #8899aa;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  padding: 5px 10px;
  border-radius: 8px;
  transition: background .2s, color .2s;
  display: block;
}
.csb-sublnk:hover { color: #ffffff; background: rgba(26,58,92,.55); }
.csb-sublnk.active { color: #ffffff; background: #1a3a5c; }
.csb-foot {
  padding: 14px;
  border-top: 1px solid rgba(255,255,255,.07);
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex-shrink: 0;
}
.csb-wa {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(37,211,102,.1);
  border: 1px solid rgba(37,211,102,.25);
  color: #25D366;
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s;
  direction: ltr;
}
.csb-wa:hover { background: rgba(37,211,102,.18); }
.csb-admin {
  text-align: center;
  color: rgba(255,255,255,.2);
  font-size: 11px;
  text-decoration: none;
  padding: 5px;
  display: block;
  transition: color .15s;
}
.csb-admin:hover { color: rgba(255,255,255,.5); }
.csb-content { flex: 1; min-width: 0; overflow-x: hidden; isolation: isolate; }

/* Mobile hamburger */
.csb-ham {
  display: none;
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 201;
  width: 44px;
  height: 44px;
  background: #0f0a02;
  border: 1px solid rgba(26,61,143,.35);
  border-radius: 10px;
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0;
}
.csb-ham span {
  display: block;
  width: 20px;
  height: 2px;
  background: #D4AF37;
  border-radius: 2px;
  transition: all .25s;
}
.csb-ham.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.csb-ham.active span:nth-child(2) { opacity: 0; }
.csb-ham.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.csb-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 140;
}
.csb-overlay.open { display: block; }

@media (max-width: 900px) {
  body.csb-layout { display: block; }
  .client-sidebar {
    position: fixed;
    right: 0;
    top: 0;
    height: 100vh;
    transform: translateX(110%);
    transition: transform .3s ease;
    z-index: 150;
    box-shadow: -8px 0 40px rgba(0,0,0,.4);
  }
  .client-sidebar.open { transform: translateX(0); }
  .csb-ham { display: flex; }
  .csb-content { width: 100%; }
}

/* صندوق الحجز اللاصق: كان مضبوطاً على أربعة وعشرين بكسلاً بتعليق «لا يوجد شريط
   علوي» — وقد صار هناك شريط، فكان يلتصق تحته ويختفي نصفه عند التمرير. */
.listing-book-box { top: calc(var(--nav-h, 70px) + 20px); }

/* ══════════════════════════════════════════════════════
   BAREZ 3D WORLD-CLASS DESIGN SYSTEM
══════════════════════════════════════════════════════ */

/* ── خلفية الهيرو: غلاف مطلق بأبعاد صريحة يحتضن اللوحة والهالات ──
   اللوحة كانت تعيد طلاء مساحة الشاشة كاملة ثلاثين مرة في الثانية، وكل اعادة
   طلاء تحتسب قفزة تخطيط جديدة. الغلاف يحصر الطلاء داخل حدوده، فمهما تغير
   مقاس اللوحة لا يتحرك اي عنصر يجاورها. */
.hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  contain: layout paint style;
}
.hero-bg > #heroCanvas {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.hero-section { position: relative; }
.hero-section__overlay { position: absolute; inset: 0; z-index: 0; }
.hero-section__content { position: relative; z-index: 3; }
.hero-section__scroll { position: absolute; z-index: 3; }

/* ── Floating Orbs ── */
.hero-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 2;
  filter: blur(90px);
  will-change: transform;
}
.hero-orb--1 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(26,61,143,.35) 0%, transparent 70%);
  top: -150px; left: -100px;
  animation: orbFloat 9s ease-in-out infinite;
}
.hero-orb--2 {
  width: 350px; height: 350px;
  background: radial-gradient(circle, rgba(74,144,226,.25) 0%, transparent 70%);
  bottom: 80px; right: 8%;
  animation: orbFloat 12s ease-in-out infinite reverse 1s;
}
.hero-orb--3 {
  width: 250px; height: 250px;
  background: radial-gradient(circle, rgba(126,200,248,.2) 0%, transparent 70%);
  top: 35%; left: 40%;
  animation: orbFloat 15s ease-in-out infinite 3s;
}
@keyframes orbFloat {
  0%,100% { transform: translate(0,0) scale(1); }
  33%      { transform: translate(40px,-40px) scale(1.07); }
  66%      { transform: translate(-25px,25px) scale(0.93); }
}

/* ── Glassmorphism ── */
.glass {
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
}
.hero-stats-bar {
  background: rgba(255,255,255,.07) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 20px !important;
}
.hero-section__badge {
  background: rgba(26,61,143,.25) !important;
  border: 1px solid rgba(74,144,226,.4) !important;
  backdrop-filter: blur(12px);
}

/* ── 3D Card Tilt (CSS fallback) ── */
.prop-card {
  transform-style: preserve-3d;
  transition: transform .4s cubic-bezier(.175,.885,.32,1.275), box-shadow .4s ease;
  will-change: transform;
}
.prop-card:hover {
  transform: perspective(800px) rotateX(-4deg) translateY(-10px);
  box-shadow: 0 30px 60px rgba(0,0,0,.18), 0 0 0 1px rgba(26,61,143,.15);
}

/* ── 3D Service Cards ── */
.service-card {
  transform-style: preserve-3d;
  transition: transform .35s ease, box-shadow .35s ease;
  will-change: transform;
}
.service-card:hover {
  transform: perspective(700px) rotateX(-5deg) rotateY(3deg) translateY(-6px);
  box-shadow: 0 20px 40px rgba(0,0,0,.3);
}

/* ── Gradient Animated Title ── */
.hero-section__title--gold {
  background: linear-gradient(135deg, #4a90e2, #7ec8f8, #2a5cc7, #a8d8f8);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientFlow 4s ease infinite;
}
@keyframes gradientFlow {
  0%,100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* ── Button Shimmer — transform only (GPU) ── */
.btn-gold {
  position: relative;
  overflow: hidden;
}
.btn-gold::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
  transform: translateX(-200%) skewX(-20deg);
  animation: shimmer 2.5s ease infinite;
  will-change: transform;
}
@keyframes shimmer {
  to { transform: translateX(500%) skewX(-20deg); }
}

/* ── 3D Button Press ── */
.btn {
  transition: transform .2s cubic-bezier(.175,.885,.32,1.275), opacity .15s;
}
.btn:hover  { transform: translateY(-3px); }
.btn:active { transform: translateY(0) scale(.97); }

/* ── Floating Animation ── */
.float-anim {
  animation: floatUp 3s ease-in-out infinite;
}
@keyframes floatUp {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

/* ── Glow Pulse — opacity only (GPU) ── */
.glow-pulse {
  animation: glowPulse 2.5s ease-in-out infinite;
}
@keyframes glowPulse {
  0%,100% { opacity: .45; }
  50%      { opacity: 1; }
}

/* ── Counter Highlight ── */
.hero-stat-item__num {
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  font-size: 1.9rem !important;
  font-weight: 600 !important;
}

/* ── Section Reveal — AOS guarantee ── */
[data-aos].aos-animate { opacity: 1 !important; transform: none !important; }
/* Fallback: show all if AOS JS never ran */
body.aos-done [data-aos]:not(.aos-animate) { opacity: 1 !important; transform: none !important; }

/* ── Background Grid ── */
.csb-content::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(26,61,143,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,61,143,.03) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
  z-index: 0;
}
.csb-content { position: relative; }
.csb-content > * { position: relative; z-index: 1; }

/* ── Numbers Section 3D ── */
.numbers-section { position: relative; overflow: hidden; }
.numbers-section::before {
  content: '';
  position: absolute;
  inset: -50%;
  background: radial-gradient(ellipse at 50% 50%, rgba(255,255,255,.08) 0%, transparent 60%);
  animation: rotateBg 20s linear infinite;
}
@keyframes rotateBg {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── About Image 3D Depth ── */
.about-intro__visual { perspective: 1000px; }
.about-img {
  transition: transform .5s ease;
  transform-style: preserve-3d;
}
.about-intro__visual:hover .about-img {
  transform: perspective(1000px) rotateY(-5deg) rotateX(3deg) scale(1.02);
}

/* ── Marquee Glow ── */
.marquee-strip {
  background: linear-gradient(135deg, #1a3d8f, #0c1e50) !important;
  position: relative;
  overflow: hidden;
}
.marquee-strip::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.06) 50%, transparent 100%);
  animation: scanLine 3s ease-in-out infinite;
}
@keyframes scanLine {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
.marquee-track { color: rgba(255,255,255,.85) !important; }

/* ── CTA Section Glow ── */
.cta-section { position: relative; overflow: hidden; }
.cta-section::before {
  content: '';
  position: absolute;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(26,61,143,.3) 0%, transparent 70%);
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  animation: ctaGlow 5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes ctaGlow {
  0%,100% { transform: translate(-50%,-50%) scale(1); opacity: .6; }
  50%      { transform: translate(-50%,-50%) scale(1.3); opacity: 1; }
}

/* ── Property Tag 3D ── */
.prop-tag {
  transition: all .2s ease;
}
.prop-card:hover .prop-tag {
  transform: translateZ(10px);
  background: rgba(26,61,143,.15) !important;
  color: #1a3d8f !important;
}

/* ── Footer Brand Logo ── */
.footer-brand__logo img { filter: brightness(0) invert(1); }

/* ── Hamburger Dark Fix ── */
.csb-ham {
  background: #071530 !important;
  border-color: rgba(74,144,226,.35) !important;
}
.csb-ham span { background: #7ec8f8 !important; }

/* ══════════════════════════════════════════════════════════════
   BAREZ LUXURY DESIGN SYSTEM v3 — PREMIUM WORLD-CLASS EDITION
══════════════════════════════════════════════════════════════ */

/* ── 1. Sidebar — نفس لوحة الموظفين بالضبط ── */
.client-sidebar {
  background: linear-gradient(180deg, #0D1B2E 0%, #091526 100%) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-left: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: -2px 0 16px rgba(0,0,0,.25) !important;
}
.csb-lnk {
  color: rgba(255,255,255,.42) !important;
  transition: background .18s, color .18s !important;
}
.csb-lnk:hover {
  background: rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.85) !important;
  transform: none !important;
}
.csb-lnk.active {
  background: linear-gradient(270deg, rgba(59,130,246,.28) 0%, rgba(59,130,246,.08) 100%) !important;
  color: #93c5fd !important;
  border: none !important;
  box-shadow: none !important;
}
.csb-lnk.active::after {
  content: '' !important;
  position: absolute !important;
  right: 0 !important; top: 12% !important; bottom: 12% !important;
  width: 3px !important;
  border-radius: 2px 0 0 2px !important;
  background: linear-gradient(180deg, #60a5fa, #2563eb) !important;
  box-shadow: 0 0 8px rgba(96,165,250,.9), 0 0 18px rgba(96,165,250,.35) !important;
}
.csb-sublnk {
  color: rgba(255,255,255,.35) !important;
  transition: background .18s, color .18s !important;
}
.csb-sublnk:hover { background: rgba(255,255,255,.07) !important; color: rgba(255,255,255,.8) !important; }
.csb-sublnk.active { color: #93c5fd !important; }

/* ── 2. Hero Search Glassmorphism ── */
.hero-search-glass {
  background: rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(14px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 16px !important;
  padding: 8px !important;
  display: flex !important;
  gap: 8px !important;
  max-width: 580px !important;
  margin: 0 auto 28px !important;
  width: 100% !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
.hero-search-glass select,
.hero-search-glass input[type="text"] {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #fff !important;
  transition: border-color 0.3s ease, background 0.3s ease !important;
}
.hero-search-glass select:focus,
.hero-search-glass input[type="text"]:focus {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(74,144,226,0.7) !important;
  outline: none !important;
}
.hero-search-glass button[type="submit"] {
  background: linear-gradient(135deg, #1a3d8f, #2a5cc7) !important;
  transition: transform 0.35s cubic-bezier(0.23,1,0.32,1) !important;
}
.hero-search-glass button[type="submit"]:hover {
  transform: scale(1.04) !important;
}

/* ── شريط الحجز في الهيرو ──────────────────────────────────
   نفس زجاج الشريط القديم حتى لا يبدو ملصوقا على الخلفية، لكن بحقول معنونة:
   الحقل بلا عنوان ظاهر يترك العميل يخمن، والتخمين في أول شاشة يكلف زيارة. */
.hero-search-glass { max-width: 1040px !important; flex-wrap: wrap !important; align-items: stretch !important; }
.hero-sf {
  display: flex; flex-direction: column; gap: 4px; flex: 1 1 132px; min-width: 0;
  text-align: right; padding: 6px 9px; border-radius: 12px;
  background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12);
  transition: border-color .25s ease, background .25s ease;
}
.hero-sf:focus-within { background: rgba(255,255,255,0.12); border-color: rgba(74,144,226,0.7); }
.hero-sf > span { font-size: 11px; font-weight: 600; letter-spacing: .02em; color: rgba(255,255,255,0.62); }
.hero-sf select, .hero-sf input {
  background: transparent !important; border: none !important; color: #fff !important;
  font-family: inherit; font-size: 14px; font-weight: 600; padding: 2px 0 !important;
  min-height: 26px; width: 100%; outline: none;
}
.hero-sf select option { background: #0d1f42; color: #fff; }
.hero-sf input[type="date"] { color-scheme: dark; }
.hero-sf--sm { flex: 0 1 78px; }
.hero-sf-btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 0 18px; border: none; border-radius: 12px; cursor: pointer; flex: 0 0 auto; white-space: nowrap;
  color: #fff; font-family: inherit; font-size: 15px; font-weight: 800;
  background: linear-gradient(135deg, #1a3d8f, #2a5cc7);
  transition: transform .25s cubic-bezier(.23,1,.32,1), box-shadow .25s ease;
}
.hero-sf-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(26,61,143,.42); }
.hero-sf-btn:focus-visible { outline: 3px solid rgba(255,255,255,.7); outline-offset: 2px; }
.hero-search-alt {
  margin: -14px auto 26px; font-size: 13px; color: rgba(255,255,255,0.72); text-align: center;
}
.hero-search-alt a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .hero-sf { flex: 1 1 46%; }
  .hero-sf-btn { flex: 1 1 100%; }
}
@media (max-width: 520px) {
  /* حقلان في السطر بدل واحد: خمسة حقول فوق بعضها تدفع زر البحث تحت الطية،
     والزر الذي لا يُرى لا يُضغط. الوجهة وحدها تبقى كاملة لأن أسماء المجمعات أطول. */
  .hero-sf { flex: 1 1 calc(50% - 4px); }
  .hero-sf--wide { flex: 1 1 100%; }
  .hero-sf--sm { flex: 1 1 calc(50% - 4px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-sf-btn { transition: none; }
  .hero-sf-btn:hover { transform: none; }
}

/* ── 3. Prop Card — Cursor-Reactive 3D ── */
.prop-card {
  transform-style: preserve-3d !important;
  transition: transform 0.6s cubic-bezier(0.23,1,0.32,1) !important;
  will-change: transform !important;
}
.prop-card:hover {
  box-shadow:
    0 32px 80px rgba(0,0,0,0.28),
    0 0 0 1px rgba(74,144,226,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
.prop-card .prop-card__img {
  overflow: hidden;
  position: relative;
}
.prop-card .prop-card__img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.14) 0%, transparent 55%);
  opacity: 0;
  transition: opacity 0.45s ease;
  pointer-events: none;
}
.prop-card:hover .prop-card__img::after { opacity: 1; }

/* ── 4. Luxury Pulse — transform+opacity ring (GPU only) ── */
@keyframes btnPulse {
  0%   { transform: scale(1);   opacity: .55; }
  100% { transform: scale(1.65); opacity: 0; }
}
.btn-gold.btn-lg {
  position: relative;
  overflow: visible;
}
.btn-gold.btn-lg::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  border: 2px solid rgba(26,61,143,.55);
  animation: btnPulse 2.8s cubic-bezier(.66,0,0,1) infinite;
  pointer-events: none;
  will-change: transform, opacity;
}
.btn-gold.btn-lg:hover {
  background: linear-gradient(135deg, #2557d6, #1a3d8f) !important;
  transform: translateY(-5px) scale(1.05) !important;
}
.btn-gold.btn-lg:hover::before {
  animation: none;
  opacity: 0;
}

/* ── 5. احجز Button (apartments) — GPU only ── */
.apt-card a {
  display: block;
  margin-top: 10px;
  background: linear-gradient(135deg, #1a3d8f, #2a5cc7);
  color: #fff !important;
  border-radius: 8px;
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  transition: transform 0.35s cubic-bezier(0.23,1,0.32,1);
  position: relative;
  overflow: hidden;
  will-change: transform;
}
.apt-card a::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.22), transparent);
  transform: translateX(-200%) skewX(-20deg);
  transition: transform 0.55s ease;
  pointer-events: none;
  will-change: transform;
}
.apt-card a:hover { transform: translateY(-3px) scale(1.05); }
.apt-card a:hover::before { transform: translateX(400%) skewX(-20deg); }

/* ── 6. Prop Card Cinematic Entrance ── */
@keyframes cardRise {
  from { opacity: 0; transform: translateY(36px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.props-grid .prop-card {
  animation: cardRise 0.7s cubic-bezier(0.23,1,0.32,1) both;
}
.props-grid .prop-card:nth-child(1) { animation-delay: 0ms; }
.props-grid .prop-card:nth-child(2) { animation-delay: 100ms; }
.props-grid .prop-card:nth-child(3) { animation-delay: 200ms; }
.props-grid .prop-card:nth-child(4) { animation-delay: 300ms; }

/* ── 7. Apt Card Cinematic Entrance — GPU only ── */
@keyframes aptRise {
  from { opacity: 0; transform: translateY(22px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.apt-card {
  animation: aptRise 0.5s cubic-bezier(0.23,1,0.32,1) both;
  transition: transform 0.4s cubic-bezier(0.23,1,0.32,1) !important;
  position: relative;
  overflow: hidden;
  will-change: transform;
}
.apt-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a3d8f, #4a90e2, #7ec8f8, #4a90e2, #1a3d8f);
  background-size: 300%;
  animation: shimmerLine 3s ease infinite;
  opacity: 0;
  transition: opacity 0.35s;
  pointer-events: none;
  will-change: background-position, opacity;
}
.apt-card:hover::before { opacity: 1; }
.apt-card:hover { transform: translateY(-6px) !important; }
@keyframes shimmerLine {
  0%   { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}

/* ── 8. Filter Buttons Premium ── */
.filter-btn {
  position: relative;
  overflow: hidden;
  transition: transform 0.25s cubic-bezier(0.23,1,0.32,1), color 0.25s, background 0.25s !important;
}
.filter-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(74,144,226,0.22), rgba(26,61,143,0.12));
  opacity: 0;
  transition: opacity 0.3s;
  border-radius: inherit;
  pointer-events: none;
}
.filter-btn:hover::after,
.filter-btn.active::after { opacity: 1; }
.filter-btn:hover { transform: translateY(-2px); }
.filter-btn:active { transform: scale(0.96); }

/* ── 9. Section Title Accent ── */
.sec-title { position: relative; display: inline-block; }
.sec-title::after {
  content: '';
  display: block;
  width: 44px;
  height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  border-radius: 2px;
  margin: 10px auto 0;
}

/* ── 10. Service Card Enhanced ── */
.service-card {
  transition: transform 0.45s cubic-bezier(0.23,1,0.32,1) !important;
}
.service-card:hover {
  transform: perspective(700px) rotateX(-4deg) translateY(-8px) !important;
}

/* ── 11. Footer social buttons ── */
.social-btn {
  transition: transform 0.3s cubic-bezier(0.23,1,0.32,1) !important;
}
.social-btn:hover {
  transform: translateY(-4px) scale(1.12) !important;
}

/* ── 12. Contain layout for grids ── */
.props-grid  { contain: layout style; }
.apt-grid    { contain: layout style; }
.listing-grid { contain: layout style; }

/* ── 13. Backdrop-filter: apply only where needed ── */
.hero-search-glass {
  /* Limit blur to small element, add GPU hint */
  transform: translateZ(0);
}
.lc-badge--type { backdrop-filter: none !important; background: rgba(0,0,0,.6) !important; }

/* ── 14. Prefers Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* ── اتساع الهيرو لشريط الحجز ─────────────────────────────
   الحاوية كانت 860 فينزل زر البحث سطرا وحده مهما وسعنا الشريط، لأن الابن
   لا يتجاوز أباه. توسع على الشاشات الكبيرة وحدها، ويبقى سطر الوصف قصيرا
   حتى لا يتحول اتساع الحاوية إلى سطر نص طويل يصعب قراءته. */
@media (min-width: 1024px) {
  /* الأب فليكس، والابن الكتلي ينكمش على محتواه فلا يبلغ سقفه أبدا. العرض
     الكامل هو ما يجعل max-width يعمل أصلا. قيست الحالة حية قبل هذا السطر. */
  .hero-section__content.hero-content-wide { width: 100% !important; max-width: 1080px !important; }
  .hero-content-wide .hero-section__desc { max-width: 640px; margin-inline: auto; }
  .hero-content-wide .hero-section__title { max-width: 900px; margin-inline: auto; }
}

/* ═══════════════════════════════════════════════════════════
   مبدّل الايجار/البيع في الهيرو، وبطاقات المخزون في الرئيسية
   ═══════════════════════════════════════════════════════════ */
.hero-mode{display:inline-flex;gap:4px;padding:4px;margin:0 auto 16px;border-radius:999px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px)}
.hero-mode__btn{display:inline-flex;align-items:center;gap:7px;padding:10px 20px;border:0;cursor:pointer;
  border-radius:999px;background:transparent;color:rgba(255,255,255,.72);font-family:inherit;
  font-size:14px;font-weight:700;transition:all .22s ease;white-space:nowrap}
.hero-mode__btn:hover{color:#fff}
.hero-mode__btn.is-on{background:#fff;color:var(--gold-dark);box-shadow:0 3px 14px rgba(0,0,0,.16)}
.hero-mode__btn svg{flex:none}

.picks-section{padding:88px 0;background:var(--white)}
.picks-section--alt{background:var(--light)}
.picks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:22px;margin-top:38px}
.pick-card{display:flex;flex-direction:column;border-radius:var(--radius);overflow:hidden;background:var(--white);
  border:1px solid var(--border);text-decoration:none;color:inherit;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.pick-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(26,61,143,.14);border-color:var(--gold)}
.pick-card__img{position:relative;aspect-ratio:4/3;background:var(--light2) center/cover no-repeat}
.pick-card__tag{position:absolute;inset-inline-start:12px;top:12px;padding:5px 12px;border-radius:999px;
  background:rgba(26,115,64,.94);color:#fff;font-size:11px;font-weight:800;letter-spacing:.2px}
.pick-card__tag--sale{background:rgba(26,61,143,.94)}
.pick-card__body{display:flex;flex-direction:column;gap:8px;padding:16px 16px 18px;flex:1}
.pick-card__ttl{font-size:16px;font-weight:800;color:var(--text);line-height:1.4}
.pick-card__meta{display:flex;flex-wrap:wrap;gap:5px;font-size:12.5px;color:var(--text3)}
.pick-card__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:auto;padding-top:12px;border-top:1px solid var(--border)}
.pick-card__price{font-size:19px;font-weight:900;color:var(--gold)}
.pick-card__price small{font-size:11.5px;font-weight:600;color:var(--text3)}
.pick-card__go{font-size:13px;font-weight:800;color:var(--gold);white-space:nowrap}
.picks-empty{margin-top:34px;text-align:center;color:var(--text2);font-size:15px}
.picks-more{margin-top:38px;text-align:center}
@media(max-width:640px){
  .picks-section{padding:60px 0}
  .picks-grid{grid-template-columns:1fr;gap:16px}
  .hero-mode{width:100%;justify-content:center}
  .hero-mode__btn{flex:1;justify-content:center;padding:11px 12px;font-size:13px}
}

/* شبكة قليلة العناصر: بلا هذا تتمدد البطاقة الواحدة على العرض كله فتبدو الصفحة خاوية */
.picks-grid:has(> :last-child:nth-child(-n+2)){
  grid-template-columns:repeat(auto-fit,minmax(272px,340px));justify-content:center}

/* البطاقة بلا صورة: خريطة صور المباني فارغة وليس كل شقة لها فيديو، فبلا هذا تظهر
   مساحة رمادية صمّاء تقرأ كأنها عطل لا كأنها وحدة حقيقية معروضة. */
.pick-card__img{display:flex;align-items:center;justify-content:center;
  background-color:var(--light2);
  background-image:linear-gradient(135deg,var(--light2) 0%,var(--light) 55%,var(--light2) 100%)}
.pick-card__img--has{background-image:none}
.pick-card__img > img{position:absolute;inset:0;display:block;width:100%;height:100%;
  object-fit:cover;border:0}
.pick-card__img::after{content:"";width:46px;height:46px;opacity:.30;
  background:var(--gold);-webkit-mask:var(--pick-ico) center/contain no-repeat;mask:var(--pick-ico) center/contain no-repeat}
.pick-card__img--has::after{display:none}
:root{--pick-ico:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/><polyline points='9 22 9 12 15 12 15 22'/></svg>")}

/* ═══════════════════════════════════════════════════════════
   شريط الثقة أعلى الهيرو — زجاج شفاف، فواصل شعرية، توهّج بالمرور
   ═══════════════════════════════════════════════════════════ */
.hero-search-glass[hidden]{display:none !important}   /* الاخفاء يسبق display:flex المُلحّة */

.trust-strip{
  display:inline-flex;align-items:stretch;gap:0;margin:0 auto 30px;padding:6px;
  border-radius:18px;position:relative;isolation:isolate;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 1px 0 rgba(255,255,255,.07) inset,0 18px 44px -22px rgba(0,0,0,.7);
  animation:trustIn .9s cubic-bezier(.22,1,.36,1) both}
@keyframes trustIn{from{opacity:0;transform:translateY(-14px) scale(.97)}to{opacity:1;transform:none}}

/* خيط ضوئي يمرّ على الحافة العليا مرة كل حين — حياة بلا ضجيج */
.trust-strip::before{content:"";position:absolute;inset-inline:14%;top:-1px;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent,rgba(126,200,248,.85),transparent);
  opacity:.55;animation:trustSheen 5.5s ease-in-out infinite}
@keyframes trustSheen{0%,100%{transform:translateX(-38%);opacity:0}
  45%{opacity:.75}55%{opacity:.75}100%{transform:translateX(38%)}}

.trust-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;
  gap:3px;padding:12px 26px;border-radius:13px;text-decoration:none;
  transition:transform .32s cubic-bezier(.22,1,.36,1),background .32s ease}
a.trust-item{cursor:pointer}
/* هالة تنمو من المركز بدل تعبئة صندوق: أقرب الى الضوء منه الى الزر */
.trust-item::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;opacity:0;
  background:radial-gradient(120% 130% at 50% 118%,rgba(74,144,226,.34),transparent 68%);
  transition:opacity .34s ease}
a.trust-item:hover{transform:translateY(-3px)}
a.trust-item:hover::before{opacity:1}
a.trust-item:focus-visible{outline:2px solid rgba(126,200,248,.75);outline-offset:3px}

.trust-item__num{font-size:23px;font-weight:800;line-height:1;color:#fff;letter-spacing:.01em;
  transition:color .3s ease,text-shadow .34s ease}
a.trust-item:hover .trust-item__num{color:#dbeeff;text-shadow:0 0 22px rgba(126,200,248,.75)}
.trust-item__num--mark{font-size:19px;color:#7ec8f8;text-shadow:0 0 16px rgba(126,200,248,.4)}
.trust-item__lbl{font-size:11.5px;font-weight:500;letter-spacing:.06em;color:rgba(255,255,255,.52);
  white-space:nowrap;transition:color .3s ease}
a.trust-item:hover .trust-item__lbl{color:rgba(255,255,255,.86)}

.trust-sep{width:1px;align-self:center;height:30px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.20),transparent)}

/* الجوال: صف واحد لا شبكة. الشبكة تأكل مئة وأربعين بكسلاً فتدفع زر البحث تحت
   الطيّة بالضبط — والشريط مهمته أن يطمئن لا أن يزاحم أول فعل في الصفحة. */
@media(max-width:720px){
  .trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;width:100%;
    padding:4px;margin-bottom:22px;border-radius:15px}
  .trust-sep{display:none}
  .trust-item{padding:9px 2px;gap:2px;border-radius:11px}
  .trust-item__num{font-size:16px}
  .trust-item__num--mark{font-size:14px}
  .trust-item__lbl{font-size:9.5px;letter-spacing:.02em}
}
@media(max-width:360px){
  .trust-item__num{font-size:14.5px}
  .trust-item__lbl{font-size:8.8px}
}
@media(prefers-reduced-motion:reduce){
  .trust-strip,.trust-strip::before{animation:none}
  .trust-item,.trust-item::before,.trust-item__num{transition:none}
}

/* ═══════════════════════════════════════════════════════════════════
   الشريط العلوي — يحوّل نفس بنية الشريط الجانبي إلى ملاحة أفقية
   شفافة تطفو فوق الصورة. لا تغيير في HTML أي صفحة: ست عشرة صفحة
   تحمل نسختها الخاصة من الشريط، فأي تعديل بنيوي يعني ست عشرة فرصة
   للاختلاف. القرار: الطبقة كلها هنا.
   ═══════════════════════════════════════════════════════════════════ */
:root{--nav-h:70px}

body.csb-layout{display:block !important}

/* ── الحاوية ── */
.client-sidebar{
  position:fixed !important;inset:0 0 auto 0 !important;
  width:auto !important;height:var(--nav-h) !important;
  flex-direction:row !important;align-items:center !important;
  gap:6px;padding:0 26px;overflow:visible !important;
  border-left:0 !important;border-bottom:1px solid rgba(255,255,255,.07) !important;
  background:linear-gradient(180deg,rgba(9,17,32,.42),rgba(9,17,32,.16)) !important;
  /* قاعدة سابقة تُلغي الضبابية بعلامة الالحاح، فبلا مثلها هنا يبقى الشريط مصمتاً */
  backdrop-filter:blur(18px) saturate(1.5) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.5) !important;
  box-shadow:none !important;
  transform:none !important;z-index:200 !important;
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,height .3s ease}

/* خيط ضوئي على الحافة السفلى يتحرك ببطء — حياة بلا ضجيج */
.client-sidebar::after{content:"";position:absolute;inset-inline:24%;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(126,200,248,.7),transparent);
  opacity:.5;animation:navSheen 7s ease-in-out infinite;pointer-events:none}
@keyframes navSheen{0%,100%{transform:translateX(-30%);opacity:0}45%,55%{opacity:.7}
  100%{transform:translateX(30%)}}

/* بعد التمرير يكتسب جسماً: النص فوق محتوى فاتح يحتاج أرضية */
.client-sidebar.is-stuck{
  height:62px !important;
  background:linear-gradient(180deg,rgba(7,14,27,.93),rgba(7,14,27,.87)) !important;
  border-bottom-color:rgba(255,255,255,.12) !important;
  box-shadow:0 12px 34px -18px rgba(0,0,0,.85)}

/* ── الشعار ── */
.csb-logo{padding:0 !important;margin:0 !important;border:0 !important;flex:none;
  height:100%;display:flex;align-items:center;transition:transform .3s ease}
.csb-logo:hover{transform:scale(1.04)}
.csb-logo img{height:38px !important;width:auto}

/* ── الروابط ── */
.csb-nav{flex:1 !important;flex-direction:row !important;align-items:center;justify-content:center;
  gap:3px;padding:0 !important;margin:0 !important;overflow:visible !important;display:flex;
  position:relative}
.csb-divider{display:none !important}

.csb-lnk{position:relative;flex-direction:row;gap:8px;padding:9px 15px !important;margin:0 !important;
  border-radius:11px;font-size:14px;white-space:nowrap;
  transition:color .3s ease,transform .3s cubic-bezier(.22,1,.36,1)}
.csb-lnk::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;opacity:0;
  background:radial-gradient(115% 145% at 50% 130%,rgba(74,144,226,.42),transparent 70%);
  transition:opacity .3s ease}
/* الخط المضيء أسفل الرابط ينمو من المنتصف */
.csb-lnk::after{content:"" !important;position:absolute !important;
  inset:auto 50% 3px 50% !important;height:2px !important;width:auto !important;
  border-radius:2px;background:linear-gradient(90deg,#4a90e2,#7ec8f8) !important;
  box-shadow:0 0 10px rgba(126,200,248,.85);opacity:0;
  transition:inset .32s cubic-bezier(.22,1,.36,1),opacity .32s ease}
.csb-lnk{color:rgba(255,255,255,.78) !important}
.csb-lnk:hover{background:transparent !important;color:#fff !important;transform:translateY(-1px)}
.csb-lnk:hover::before{opacity:1}
.csb-lnk:hover::after,.csb-lnk.active::after{inset:auto 22% 3px 22% !important;opacity:1}
.csb-lnk.active{background:transparent !important;color:#fff !important}
.csb-lnk:focus-visible{outline:2px solid rgba(126,200,248,.8);outline-offset:2px}
.csb-ico{display:inline-flex;align-items:center;width:auto !important;opacity:.72;
  transition:opacity .3s ease,transform .3s ease}
.csb-lnk:hover .csb-ico{opacity:1;transform:translateY(-1px)}

/* ── القائمة المنسدلة تحت «عقاراتنا» ── */
.csb-sub{position:absolute !important;top:calc(100% + 10px);
  left:var(--sub-x,0);right:auto;
  display:flex !important;flex-direction:column;gap:2px;min-width:158px;padding:7px !important;
  margin:0 !important;border-radius:14px;
  background:linear-gradient(180deg,rgba(11,20,38,.97),rgba(8,15,29,.97));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 26px 54px -22px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.06) inset;
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.97);transform-origin:top center;
  transition:opacity .26s ease,transform .26s cubic-bezier(.22,1,.36,1),visibility .26s;
  z-index:5}
.csb-sub::before{content:"";position:absolute;top:-10px;inset-inline:0;height:10px}
.csb-lnk:hover + .csb-sub,
.csb-sub:hover,.csb-sub:focus-within{opacity:1;visibility:visible;transform:none}
.csb-sublnk{padding:9px 13px !important;padding-right:13px !important;border-radius:9px;
  font-size:13.5px;line-height:1.3;color:rgba(255,255,255,.72) !important;white-space:nowrap;
  transition:background .24s ease,color .24s ease,padding-inline-start .24s ease}
.csb-sublnk:hover{background:rgba(74,144,226,.18) !important;color:#fff !important;
  padding-inline-start:19px !important}

/* ── واتساب في الطرف ── */
.csb-foot{padding:0 !important;margin:0 !important;border:0 !important;flex:none}
.csb-wa{position:relative;padding:9px 16px !important;border-radius:11px;font-size:13.5px;
  background:rgba(37,211,102,.13) !important;border:1px solid rgba(37,211,102,.30);
  transition:background .3s ease,box-shadow .34s ease,transform .3s cubic-bezier(.22,1,.36,1)}
.csb-wa:hover{background:rgba(37,211,102,.24) !important;transform:translateY(-2px);
  box-shadow:0 0 0 1px rgba(37,211,102,.45),0 10px 26px -10px rgba(37,211,102,.65)}
.csb-admin{display:none !important}

/* ── المحتوى تحت الشريط، والهيرو يمرّ من تحته ── */
.csb-content{padding-top:var(--nav-h)}
.csb-content > .hero-section:first-child{
  margin-top:calc(var(--nav-h) * -1);padding-top:calc(78px + var(--nav-h))}

/* ── الجوال: زر ثم لوحة منسدلة بعرض الشاشة ── */
/* الزر الى يسار الشريط والشعار الى يمينه: كلاهما كان مثبَّتاً على اليمين فيجلس
   الزر فوق الشعار تماماً — الشعار مخفي والنقر عليه يفتح القائمة. */
.csb-ham{top:13px !important;right:auto !important;left:14px !important;
  background:rgba(11,20,38,.75) !important;border-color:rgba(255,255,255,.16) !important;
  backdrop-filter:blur(10px)}
.csb-ham span{background:#7ec8f8 !important}

@media(max-width:900px){
  :root{--nav-h:62px}
  .client-sidebar{height:var(--nav-h) !important;padding:0 16px;
    box-shadow:none !important}
  .csb-logo img{height:32px !important}
  .csb-ham{display:flex !important}
  /* اللوحة تنزل من تحت الشريط ولا تغطي الشعار */
  .csb-nav{position:absolute;inset-inline:10px;top:calc(var(--nav-h) + 6px);
    flex-direction:column !important;align-items:stretch;gap:2px;padding:9px !important;
    border-radius:16px;background:linear-gradient(180deg,rgba(10,19,36,.98),rgba(7,14,27,.98));
    border:1px solid rgba(255,255,255,.10);box-shadow:0 26px 60px -24px rgba(0,0,0,.92);
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .28s ease,transform .28s cubic-bezier(.22,1,.36,1),visibility .28s}
  .client-sidebar.open .csb-nav{opacity:1;visibility:visible;transform:none}
  .csb-lnk{padding:12px 14px !important;font-size:15px}
  .csb-lnk::after{display:none !important}
  .csb-sub{position:static !important;opacity:1 !important;visibility:visible !important;
    transform:none !important;background:transparent;border:0;box-shadow:none;
    padding:2px 0 6px 0 !important;min-width:0;
    border-inline-start:1px solid rgba(255,255,255,.12);margin-inline-start:20px !important}
  .csb-sublnk{padding:9px 14px !important}
  .csb-foot{position:absolute;left:66px;right:auto;top:11px}
  .csb-wa{padding:8px 12px !important;font-size:12.5px}
  .csb-wa span{display:none}
  .csb-overlay{z-index:190}
}
@media(max-width:420px){ .csb-foot{display:none !important} }

@media(prefers-reduced-motion:reduce){
  .client-sidebar,.client-sidebar::after,.csb-lnk,.csb-lnk::before,.csb-lnk::after,
  .csb-sub,.csb-wa,.csb-logo,.csb-nav{transition:none !important;animation:none !important}
}

/* ═══════════════════════════════════════════════════════════════════
   ظهور العناصر بلا مكتبة خارجية
   مكتبة aos كانت محجوبة بسياسة امن المحتوى فلم تعمل قط على الانتاج.
   هذا السطر يضمن ظهور العناصر الثمانية عشر بالنمط وحده بلا اي جافاسكربت.
   ═══════════════════════════════════════════════════════════════════ */
[data-aos]{opacity:1;transform:none}

/* ═══════════════════════════════════════════════════════════════════
   الجوال: اطفاء الحركات الزخرفية اللانهائية
   كل حركة منها تعيد طلاء ما تحتها بلا توقف، وهذا ما كان يراكم قفزات
   التخطيط طوال الزيارة لا عند التحميل فقط، ويستهلك معالج الجهاز
   وبطاريته بلا مقابل بصري يستحق على شاشة بهذا الحجم.
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .hero-orb,
  .scroll-icon,
  .hero-section__title--gold,
  .trust-strip,
  .trust-strip::before,
  .client-sidebar::after,
  .marquee-strip::before,
  .numbers-section::before,
  .cta-section::before,
  .btn-gold::after,
  .btn-gold.btn-lg::before,
  .apt-card::before { animation: none !important; }
}