/* Empire City — ECC catalog skin + "Most popular" module v1 — 2026-11-04 */
/* 1. accent: legacy red -> new gold */
html.ecx-navy{--x-acc:#E6B57E!important;--x-acc-txt:#F3CFA0!important;--x-acc-ink:#070a12!important;--x-acc-glow:rgba(230,181,126,.26)!important}
html.ecx-navy body #sp-main-body{background:radial-gradient(900px 520px at 100% 0%,rgba(230,181,126,.07),transparent 65%),radial-gradient(1000px 600px at 0% 35%,rgba(70,100,180,.12),transparent 65%),#070a12!important}
html.ecx-cat body .ecx-fbar .ecx-chip.is-on{background:linear-gradient(135deg,#F3CFA0,#E6B57E)!important;color:#070a12!important;border-color:transparent!important;font-weight:700!important}
html.ecx-cat body .ecx-acc{color:#F3CFA0!important}
html.ecx-navy body .ecx-card .property-card__address svg{color:#E6B57E!important}
html.ecx-navy body .ecx-card:hover .ecx-card__act .ecx-btn{background:#fff!important;color:#070a12!important;border-color:#fff!important;box-shadow:0 12px 30px rgba(0,0,0,.35)!important}
html.ecx-navy body .ecx-card:hover{border-color:rgba(230,181,126,.38)!important}
html.ecx-navy body #show-more-btn{border-radius:999px!important;padding:16px 34px!important;font-weight:700!important;background:rgba(255,255,255,.06)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;backdrop-filter:blur(10px)}
html.ecx-navy body #show-more-btn:hover{background:#fff!important;color:#070a12!important;border-color:#fff!important;box-shadow:0 14px 34px rgba(0,0,0,.35)!important}
html.ecx-navy body #osproperty-filter-form #apply-filters,html.ecx-navy body #osproperty-filter-form .checkbox-btn.active{color:#070a12!important}

/* 2. Most popular module */
#epp-pop,#epp-pop *{box-sizing:border-box;font-family:'Manrope','Vazirmatn','Noto Sans Devanagari',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important}
#epp-pop{position:relative;margin:64px 0 24px;padding:clamp(22px,3.4vw,46px);border-radius:32px!important;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));isolation:isolate;overflow:hidden;color:#fff}
#epp-pop::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--epp-a,0deg),rgba(230,181,126,.0),rgba(243,207,160,.85),rgba(230,181,126,.0) 30%,rgba(255,255,255,.12) 55%,rgba(230,181,126,.0) 70%,rgba(243,207,160,.6),rgba(230,181,126,0));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:epp-spin 9s linear infinite;z-index:2}
#epp-pop::after{content:"";position:absolute;width:640px;height:640px;inset-inline-end:-220px;top:-300px;background:radial-gradient(closest-side,rgba(230,181,126,.16),transparent);pointer-events:none;z-index:-1}
@property --epp-a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes epp-spin{to{--epp-a:360deg}}
#epp-pop .epp-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(20px,2.6vw,34px);flex-wrap:wrap}
#epp-pop .epp-eye{display:inline-flex;align-items:center;gap:10px;font-size:12px!important;font-weight:700!important;letter-spacing:.2em!important;text-transform:uppercase;color:#E6B57E!important;margin:0 0 14px}
#epp-pop .epp-eye i{width:28px;height:28px;border-radius:50%!important;display:grid;place-items:center;background:rgba(230,181,126,.14);border:1px solid rgba(230,181,126,.35)}
#epp-pop .epp-eye svg{width:14px;height:14px}
#epp-pop h2.epp-t{margin:0!important;font-size:clamp(28px,4.2vw,54px)!important;font-weight:800!important;line-height:1.02!important;letter-spacing:-.02em!important;text-transform:uppercase;color:#fff!important}
#epp-pop h2.epp-t span{display:block;background:linear-gradient(90deg,#F3CFA0,#E6B57E 60%,#c8955d);-webkit-background-clip:text;background-clip:text;color:transparent!important}
#epp-pop .epp-sub{margin:14px 0 0!important;max-width:560px;color:rgba(220,228,240,.72)!important;font-size:15px!important;line-height:1.6!important}
#epp-pop .epp-nav{display:flex;gap:10px;align-items:center}
#epp-pop .epp-all{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px!important;background:#fff;color:#070a12!important;font-weight:700!important;font-size:14px!important;text-decoration:none!important;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s;white-space:nowrap}
#epp-pop .epp-all:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,0,0,.35)}
#epp-pop .epp-all svg,#epp-pop .epp-go svg,#epp-pop .epp-arr svg{width:16px;height:16px}
[dir=rtl] #epp-pop .epp-all svg,[dir=rtl] #epp-pop .epp-go svg,html[dir=rtl] #epp-pop .epp-cta svg{transform:scaleX(-1)}
#epp-pop .epp-arr{display:none;width:46px;height:46px;border-radius:50%!important;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:#fff;place-items:center;cursor:pointer;transition:background .2s,color .2s}
#epp-pop .epp-arr:hover{background:#fff;color:#070a12}
#epp-pop .epp-arr--p svg{transform:scaleX(-1)}
[dir=rtl] #epp-pop .epp-arr--p svg{transform:none}[dir=rtl] #epp-pop .epp-arr--n svg{transform:scaleX(-1)}

#epp-pop .epp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(300px,1fr));gap:18px}
#epp-pop .epp-card{position:relative;display:block;border-radius:24px!important;overflow:hidden;min-height:250px;text-decoration:none!important;color:#fff!important;background:#0f1218;border:1px solid rgba(255,255,255,.1);transform:translateZ(0);transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .45s;opacity:0;translate:0 26px}
#epp-pop.is-in .epp-card{opacity:1;translate:0 0;transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .45s,opacity .7s ease var(--d,0s),translate .7s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
#epp-pop .epp-card:hover{transform:translateY(-6px);border-color:rgba(230,181,126,.55);box-shadow:0 26px 60px rgba(0,0,0,.45),0 0 0 1px rgba(230,181,126,.18)}
#epp-pop .epp-card--xl{grid-column:span 2;grid-row:span 2}
#epp-pop .epp-media{position:absolute;inset:0;border-radius:0!important}
#epp-pop .epp-media img{width:100%!important;height:100%!important;object-fit:cover;display:block;border-radius:0!important;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(.92)}
#epp-pop .epp-card:hover .epp-media img{transform:scale(1.07);filter:saturate(1.06)}
#epp-pop .epp-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,18,.35) 0%,rgba(7,10,18,0) 30%,rgba(7,10,18,.55) 58%,rgba(7,10,18,.96) 100%);border-radius:0!important}
#epp-pop .epp-top{position:absolute;inset-inline:16px;top:16px;display:flex;align-items:center;gap:8px;z-index:1}
#epp-pop .epp-hot,#epp-pop .epp-type{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px!important;font-size:11.5px!important;font-weight:700!important;letter-spacing:.06em;text-transform:uppercase}
#epp-pop .epp-hot{background:linear-gradient(135deg,#F3CFA0,#E6B57E);color:#070a12!important;box-shadow:0 8px 22px rgba(230,181,126,.35)}
#epp-pop .epp-hot svg{width:13px;height:13px}
#epp-pop .epp-type{background:rgba(7,10,18,.55);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px);color:#fff!important}
#epp-pop .epp-card:not(.epp-card--xl) .epp-type{display:none}
#epp-pop .epp-rank{margin-inline-start:auto;font-size:44px!important;font-weight:800!important;line-height:1!important;letter-spacing:-.04em;color:transparent!important;-webkit-text-stroke:1.2px rgba(243,207,160,.85);text-shadow:0 6px 30px rgba(0,0,0,.35)}
#epp-pop .epp-card--xl .epp-rank{font-size:84px!important}
#epp-pop .epp-body{position:absolute;inset-inline:18px;bottom:18px;z-index:1}
#epp-pop .epp-card--xl .epp-body{inset-inline:28px;bottom:28px}
#epp-pop .epp-loc{display:flex;align-items:center;gap:6px;font-size:12.5px!important;color:rgba(230,236,246,.78)!important;margin:0 0 6px}
#epp-pop .epp-loc svg{width:13px;height:13px;color:#E6B57E;flex:none}
#epp-pop h3.epp-n{margin:0 0 12px!important;font-size:17px!important;font-weight:800!important;line-height:1.2!important;letter-spacing:-.01em!important;color:#fff!important;text-transform:none!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#epp-pop .epp-card--xl h3.epp-n{font-size:clamp(22px,2.4vw,34px)!important;margin-bottom:18px!important}
#epp-pop .epp-meta{display:flex;align-items:flex-end;gap:18px;padding-top:12px;border-top:1px solid rgba(255,255,255,.14)}
#epp-pop .epp-meta small{display:block;font-size:10.5px!important;letter-spacing:.14em;text-transform:uppercase;color:rgba(220,228,240,.6)!important;margin-bottom:3px}
#epp-pop .epp-meta b{display:block;direction:ltr;unicode-bidi:isolate;text-align:start;font-size:16px!important;font-weight:800!important;color:#fff!important;white-space:nowrap}
#epp-pop .epp-card--xl .epp-meta b{font-size:22px!important}
#epp-pop .epp-go{margin-inline-start:auto;width:40px;height:40px;border-radius:50%!important;display:grid;place-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;flex:none;transition:background .25s,color .25s,transform .35s}
#epp-pop .epp-card:hover .epp-go{background:#fff;color:#070a12;transform:rotate(-45deg)}
[dir=rtl] #epp-pop .epp-card:hover .epp-go{transform:rotate(45deg)}
#epp-pop .epp-cta{display:none;margin-inline-start:auto;align-items:center;gap:10px;height:46px;padding:0 20px;border-radius:999px!important;background:#fff;color:#070a12!important;font-weight:700!important;font-size:14px!important;white-space:nowrap;transition:box-shadow .25s}
#epp-pop .epp-card--xl .epp-cta{display:inline-flex}
#epp-pop .epp-card--xl .epp-go{display:none}
#epp-pop .epp-cta svg{width:16px;height:16px}
#epp-pop .epp-dots{display:none;justify-content:center;gap:6px;margin-top:16px}
#epp-pop .epp-dots i{width:6px;height:6px;border-radius:999px!important;background:rgba(255,255,255,.25);transition:width .3s,background .3s}
#epp-pop .epp-dots i.is-on{width:22px;background:#E6B57E}
/* skeleton */
#epp-pop .epp-sk{background:linear-gradient(100deg,rgba(255,255,255,.04) 30%,rgba(255,255,255,.09) 50%,rgba(255,255,255,.04) 70%);background-size:200% 100%;animation:epp-sk 1.4s linear infinite;opacity:1!important;translate:none!important}
@keyframes epp-sk{to{background-position:-200% 0}}

@media (max-width:1100px){
  #epp-pop .epp-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:minmax(300px,auto)}
  #epp-pop .epp-card--xl{grid-column:span 2;grid-row:span 1;min-height:420px}
  #epp-pop .epp-card--xl .epp-rank{font-size:64px!important}
  #epp-pop .epp-card:not(.epp-card--xl) .epp-type{display:inline-flex}
}
@media (max-width:767px){
  #epp-pop{margin:44px 0 12px;border-radius:26px!important;padding:24px 0 22px}
  #epp-pop .epp-hd{padding:0 20px;margin-bottom:20px}
  #epp-pop .epp-nav{width:100%}
  #epp-pop .epp-all{flex:1;justify-content:center}
  #epp-pop .epp-arr{display:grid;flex:none}
  #epp-pop .epp-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding:0 20px 4px;scroll-padding-inline:20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #epp-pop .epp-grid::-webkit-scrollbar{display:none}
  #epp-pop .epp-card,#epp-pop .epp-card--xl{flex:0 0 84%;min-height:400px;scroll-snap-align:start}
  #epp-pop .epp-card--xl .epp-rank,#epp-pop .epp-rank{font-size:56px!important}
  #epp-pop .epp-card--xl h3.epp-n,#epp-pop h3.epp-n{font-size:21px!important}
  #epp-pop .epp-card--xl .epp-body,#epp-pop .epp-body{inset-inline:20px;bottom:20px}
  #epp-pop .epp-card--xl .epp-cta{display:none}
  #epp-pop .epp-card--xl .epp-go{display:grid}
  #epp-pop .epp-card--xl .epp-meta b{font-size:17px!important}
  #epp-pop .epp-dots{display:flex}
  #epp-pop .epp-sub{font-size:14px!important}
}
@media (prefers-reduced-motion:reduce){#epp-pop::before{animation:none}#epp-pop .epp-card{opacity:1;translate:none}}

/* ERX a11y 2026-11-04: filter label "Эмираты" had 40% opacity text on dark glass (contrast < 4.5:1) */
html.ecx-cat .ecx-fhead .ecx-chips__l{color:rgba(220,228,240,.74)!important}