/* ═══════════════════════════════════════════════════════════
   EP Off-Plan Manager — Frontend Widgets v2.1
   Font: Plus Jakarta Sans (loaded via wp_head filter)
═══════════════════════════════════════════════════════════ */
/* Font is loaded via wp_enqueue_style in class-widgets.php (ep-fonts-css) */

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --ep-red:       #E02E16;
  --ep-red-dk:    #B82310;
  --ep-red-light: #FF5C3D;
  --ep-red-soft:  rgba(224,46,22,.08);
  --ep-black:     #0A0A0A;
  --ep-dark:      #161616;
  --ep-navy:      #0B1018;
  --ep-white:     #FFFFFF;
  --ep-off:       #F7F8FA;
  --ep-border:    #EAEDF0;
  --ep-text:      #16181D;
  --ep-muted:     #6B7280;
  --ep-light:     #9CA3AF;
  --ep-wa:        #25D366;
  --ep-wa-dk:     #1DA851;
  --ep-gold:      #C9973A;

  --ep-grad-red:  linear-gradient(135deg, #FF5C3D 0%, #E02E16 50%, #B82310 100%);
  --ep-grad-dark: linear-gradient(160deg, #1A1A1A 0%, #0A0A0A 100%);
  --ep-grad-gold: linear-gradient(135deg, #E8C16A 0%, #C9973A 100%);

  --ep-shadow-sm: 0 2px 8px rgba(0,0,0,.06);
  --ep-shadow:    0 8px 32px rgba(0,0,0,.10);
  --ep-shadow-lg: 0 24px 64px rgba(0,0,0,.18);
  --ep-shadow-red: 0 12px 40px rgba(224,46,22,.35);
  --ep-glow-red:  0 0 0 1px rgba(224,46,22,.15), 0 20px 60px -10px rgba(224,46,22,.4);

  --ep-radius:    14px;
  --ep-radius-sm: 8px;
  --ep-radius-lg: 22px;
  --ep-font:      'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ep-ease:      cubic-bezier(0.4, 0, 0.2, 1);
  --ep-spring:    cubic-bezier(0.34, 1.56, 0.64, 1);
  --ep-t:         0.3s;
  --ep-section-py: clamp(64px, 9vw, 120px);
  --ep-section-px: clamp(20px, 5vw, 60px);
}

/* ── RESET INSIDE PLUGIN COMPONENTS ─────────────────────── */
.ep-hero *, .ep-highlights-strip *, .ep-description-block *,
.ep-gallery-carousel *, .ep-amenities-wrap *, .ep-floorplans *,
.ep-payment-wrap *, .ep-location-wrap *, .ep-dev-band *,
.ep-enquiry-wrap *, .ep-grid * {
  box-sizing: border-box;
}

/* ── SCROLL REVEAL ───────────────────────────────────────── */
.ep-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.7s var(--ep-ease), transform 0.7s var(--ep-ease);
}
.ep-reveal.ep-visible { opacity: 1; transform: none; }
.ep-reveal-left  { opacity: 0; transform: translateX(-32px); transition: opacity 0.7s var(--ep-ease), transform 0.7s var(--ep-ease); }
.ep-reveal-left.ep-visible  { opacity: 1; transform: none; }
.ep-reveal-right { opacity: 0; transform: translateX(32px);  transition: opacity 0.7s var(--ep-ease), transform 0.7s var(--ep-ease); }
.ep-reveal-right.ep-visible { opacity: 1; transform: none; }
.ep-reveal-d1 { transition-delay: 0.1s; }
.ep-reveal-d2 { transition-delay: 0.2s; }
.ep-reveal-d3 { transition-delay: 0.3s; }
.ep-reveal-d4 { transition-delay: 0.4s; }

/* ── SHARED BUTTONS ─────────────────────────────────────── */
.ep-btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 15px 30px; border-radius: var(--ep-radius-sm);
  font-family: var(--ep-font); font-size: 13.5px; font-weight: 700;
  letter-spacing: .02em; text-decoration: none;
  border: none; cursor: pointer;
  transition: all 0.35s var(--ep-spring);
  white-space: nowrap;
  position: relative; overflow: hidden;
}
.ep-btn svg { flex-shrink: 0; position: relative; z-index: 1; }

.ep-btn-red {
  background: #E02E16; color: #fff;
  box-shadow: var(--ep-shadow-red);
}
.ep-btn-red::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.25), transparent 60%);
  opacity: 0; transition: opacity var(--ep-t) var(--ep-ease);
}
.ep-btn-red:hover {
  color: #fff;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 18px 50px -8px rgba(224,46,22,.6);
}
.ep-btn-red:hover::before { opacity: 1; }

.ep-btn-outline-dark {
  background: var(--ep-white);
  border: 1.5px solid var(--ep-border);
  color: var(--ep-text);
  box-shadow: var(--ep-shadow-sm);
}
.ep-btn-outline-dark:hover {
  border-color: var(--ep-red); color: var(--ep-red);
  transform: translateY(-3px);
  box-shadow: var(--ep-shadow);
}

.ep-btn-outline-light {
  background: rgba(255,255,255,.06);
  border: 1.5px solid rgba(255,255,255,.18);
  color: #fff; backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.ep-btn-outline-light:hover {
  border-color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.12);
  transform: translateY(-3px);
}

.ep-btn-wa {
  background: linear-gradient(135deg, #2EE572 0%, #25D366 100%);
  color: #fff;
  box-shadow: 0 12px 40px -8px rgba(37,211,102,.55);
}
.ep-btn-wa:hover {
  color: #fff;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 18px 50px -8px rgba(37,211,102,.65);
}

.ep-btn-wa-ghost {
  background: transparent;
  border: 1.5px solid var(--ep-wa);
  color: var(--ep-wa-dk);
}
.ep-btn-wa-ghost:hover { background: var(--ep-wa); color: #fff; transform: translateY(-3px); }

/* ── SHARED TYPOGRAPHY ──────────────────────────────────── */
.ep-eyebrow {
  font-family: var(--ep-font); font-size: 12px; font-weight: 800;
  letter-spacing: .22em; text-transform: uppercase; color: var(--ep-red);
  margin: 0 0 14px; display: flex; align-items: center; gap: 12px;
}
.ep-eyebrow::before {
  content: ''; display: block; width: 32px; height: 3px;
  background: #E02E16; border-radius: 3px; flex-shrink: 0;
}

.ep-section-title {
  font-family: var(--ep-font);
  font-size: clamp(28px, 4.2vw, 48px);
  font-weight: 800; color: var(--ep-black);
  line-height: 1.08; letter-spacing: -.025em;
  margin: 0 0 18px;
}
.ep-section-title span {
  background: #E02E16;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--ep-red);
}
.ep-section-title.light,
.ep-roi-wrap .ep-section-title,
.ep-payment-header .ep-section-title {
  color: #ffffff !important;
}
.ep-section-title.light span,
.ep-roi-wrap .ep-section-title span,
.ep-payment-header .ep-section-title span {
  background: #E02E16;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--ep-red);
}

.ep-section-body {
  font-family: var(--ep-font);
  font-size: 16px; line-height: 1.85;
  color: var(--ep-muted); margin: 0;
  font-weight: 400;
}
.ep-no-data { font-size: 13px; color: var(--ep-muted); padding: 24px 0; font-style: italic; }

/* ── BADGES ─────────────────────────────────────────────── */
.ep-badge {
  font-family: var(--ep-font); font-size: 10px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: 5px 12px; border-radius: 4px;
  display: inline-flex; align-items: center; gap: 5px;
}
.ep-badge-red     { background: var(--ep-red); color: #fff; }
.ep-badge-gold    { background: linear-gradient(135deg,#C9973A,#E8C16A); color: #fff; }
.ep-badge-outline { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); color: #fff; backdrop-filter: blur(8px); }

/* ══════════════════════════════════════════════════════════
   HERO
══════════════════════════════════════════════════════════ */
.ep-hero {
  position: relative;
  min-height: 100svh;
  display: flex; flex-direction: column; justify-content: flex-end;
  overflow: hidden; background: #111111;
  font-family: var(--ep-font);
}

.ep-hero-media { position: absolute; inset: 0; }
.ep-hero-carousel, .ep-hero-bg { position: absolute; inset: 0; }

.ep-hero-slide {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 1.4s var(--ep-ease), transform 8s linear;
}
.ep-hero-slide.active { opacity: 1; transform: scale(1); }
.ep-hero-bg { background-size: cover; background-position: center; opacity: .45; }

.ep-hero-overlay {
  position: absolute; inset: 0;
  background:
    linear-gradient(to top,  rgba(5,5,8,1) 0%,  rgba(5,5,8,.7) 35%, rgba(5,5,8,.25) 65%, rgba(5,5,8,.1) 100%),
    linear-gradient(to right, rgba(5,5,8,.6) 0%, transparent 65%);
}
/* Subtle red glow accent in corner */
.ep-hero-overlay::after {
  content: '';
  position: absolute; top: -20%; right: -10%;
  width: 50%; height: 70%;
  background: radial-gradient(circle, rgba(224,46,22,.18) 0%, transparent 70%);
  pointer-events: none;
}

.ep-hero-content {
  position: relative; z-index: 2;
  padding: 110px var(--ep-section-px) 80px;
  max-width: 1320px; margin: 0 auto; width: 100%;
}

.ep-hero-badges { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }

.ep-hero-dev {
  font-size: 12px; font-weight: 800; letter-spacing: .26em;
  text-transform: uppercase; color: var(--ep-red-light);
  margin-bottom: 14px; display: flex; align-items: center; gap: 10px;
}
.ep-hero-dev::before {
  content: ''; width: 28px; height: 3px;
  background: #E02E16; border-radius: 3px;
}

.ep-hero-title {
  font-family: var(--ep-font);
  font-size: clamp(46px, 9vw, 104px);
  font-weight: 800; color: #fff;
  line-height: 0.98; letter-spacing: -.035em;
  margin: 0 0 14px;
  text-shadow: 0 4px 40px rgba(0,0,0,.4);
}

.ep-hero-sub {
  font-size: 16px; font-weight: 400;
  color: rgba(255,255,255,.55); letter-spacing: .02em;
  margin: 0 0 44px; max-width: 480px;
}

/* Stats bar */
.ep-hero-stats {
  display: flex;
  max-width: 680px; margin: 0 0 44px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--ep-radius);
  overflow: hidden;
  background: rgba(255,255,255,.045);
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  box-shadow: 0 20px 60px -20px rgba(0,0,0,.5);
}
.ep-hstat {
  flex: 1; padding: 22px 24px;
  border-right: 1px solid rgba(255,255,255,.09);
  transition: background var(--ep-t) var(--ep-ease);
  position: relative;
}
.ep-hstat:last-child { border-right: none; }
.ep-hstat:hover { background: rgba(224,46,22,.1); }
.ep-hstat:hover::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: #E02E16;
}
.ep-hstat-val {
  font-size: 23px; font-weight: 800; color: #fff;
  line-height: 1; margin-bottom: 6px;
  letter-spacing: -.01em;
}
.ep-hstat-key {
  font-size: 10.5px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.4);
}

/* CTAs */
.ep-hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }

/* Hero entrance animation */
.ep-hero-badges,
.ep-hero-dev,
.ep-hero-title,
.ep-hero-sub,
.ep-hero-stats,
.ep-hero-ctas,
.ep-hero-trust {
  opacity: 0;
  transform: translateY(28px);
  animation: ep-hero-rise 0.9s var(--ep-ease) forwards;
}
.ep-hero-badges { animation-delay: 0.05s; }
.ep-hero-dev    { animation-delay: 0.12s; }
.ep-hero-title  { animation-delay: 0.18s; }
.ep-hero-sub    { animation-delay: 0.28s; }
.ep-hero-stats  { animation-delay: 0.38s; }
.ep-hero-ctas   { animation-delay: 0.48s; }
.ep-hero-trust  { animation-delay: 0.58s; }
@keyframes ep-hero-rise {
  to { opacity: 1; transform: none; }
}

/* Carousel controls */
.ep-carousel-prev, .ep-carousel-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(8px);
  transition: all var(--ep-t) var(--ep-ease); z-index: 5;
}
.ep-carousel-prev { left: 24px; }
.ep-carousel-next { right: 24px; }
.ep-carousel-prev:hover, .ep-carousel-next:hover {
  background: var(--ep-red);
  border-color: var(--ep-red);
  transform: translateY(-50%) scale(1.08);
}

.ep-carousel-dots {
  position: absolute; bottom: 28px; left: 50%;
  transform: translateX(-50%);
  display: flex; gap: 8px; z-index: 5;
}
.ep-dot {
  width: 6px; height: 6px; border-radius: 3px;
  background: rgba(255,255,255,.35); border: none;
  cursor: pointer; padding: 0;
  transition: all 0.35s var(--ep-ease);
}
.ep-dot.active {
  width: 24px; background: var(--ep-red);
}

.ep-slide-caption {
  position: absolute; bottom: 12px; left: 20px;
  font-size: 12px; color: rgba(255,255,255,.55);
  font-family: var(--ep-font);
}

@media(max-width:768px){
  .ep-carousel-prev, .ep-carousel-next { display: none; }
  .ep-hero-stats { flex-wrap: wrap; }
  .ep-hstat { flex: 0 0 50%; }
  .ep-hstat:nth-child(2) { border-right: none; }
}

/* ══════════════════════════════════════════════════════════
   HIGHLIGHTS STRIP
══════════════════════════════════════════════════════════ */
.ep-highlights-strip {
  background: #111111;
  display: flex; align-items: stretch;
  border-bottom: 1px solid rgba(255,255,255,.06);
  font-family: var(--ep-font);
  position: relative;
}
.ep-highlights-strip::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: #E02E16; opacity: .6;
}
.ep-hl-item {
  flex: 1; display: flex; align-items: center; gap: 16px;
  padding: 26px 30px;
  border-right: 1px solid rgba(255,255,255,.07);
  transition: all var(--ep-t) var(--ep-ease);
  position: relative;
}
.ep-hl-item:last-child { border-right: none; }
.ep-hl-item:hover {
  background: rgba(224,46,22,.06);
  transform: translateY(-2px);
}

.ep-hl-icon {
  width: 46px; height: 46px; flex-shrink: 0;
  background: rgba(224,46,22,.12);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ep-red-light);
  transition: all var(--ep-t) var(--ep-ease);
  border: 1px solid rgba(224,46,22,.15);
}
.ep-hl-item:hover .ep-hl-icon {
  background: #E02E16;
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 24px -4px rgba(224,46,22,.5);
}

.ep-hl-val {
  font-size: 16px; font-weight: 800; color: #fff; line-height: 1.2;
  letter-spacing: -.01em;
}
.ep-hl-key {
  font-size: 10.5px; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.4); margin-top: 3px;
}

@media(max-width:900px){
  .ep-highlights-strip { flex-wrap: wrap; }
  .ep-hl-item { flex: 0 0 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,.06); }
}
@media(max-width:480px){ .ep-hl-item { flex: 0 0 100%; } }

/* ══════════════════════════════════════════════════════════
   DESCRIPTION BLOCK
══════════════════════════════════════════════════════════ */
.ep-description-block {
  padding: var(--ep-section-py) var(--ep-section-px);
  max-width: 1280px; margin: 0 auto;
  font-family: var(--ep-font);
}
.ep-description-block p {
  font-size: 15px; line-height: 1.85; color: var(--ep-muted);
  margin: 0 0 18px; max-width: 760px;
}
.ep-description-block p:last-child { margin-bottom: 0; }

/* Split layout when an image is set */
.ep-description-split { padding: var(--ep-section-py) var(--ep-section-px); }
.ep-description-grid {
  display: grid; grid-template-columns: 1.1fr 0.9fr;
  gap: 64px; align-items: center;
  max-width: 1280px; margin: 0 auto;
}
@media(max-width:900px){
  .ep-description-grid { grid-template-columns: 1fr; gap: 36px; }
  .ep-description-media { order: -1; }
}
.ep-description-text p { max-width: none; }
.ep-description-media {
  position: relative;
}
.ep-description-media img {
  width: 100%; aspect-ratio: 4/5;
  object-fit: cover; display: block;
  border-radius: var(--ep-radius-lg);
  box-shadow: var(--ep-shadow-lg);
}

/* ══════════════════════════════════════════════════════════
   GALLERY CAROUSEL
══════════════════════════════════════════════════════════ */
.ep-gallery-section {
  padding: var(--ep-section-py) var(--ep-section-px);
  max-width: 1320px; margin: 0 auto;
  font-family: var(--ep-font);
}

.ep-gallery-header {
  margin-bottom: 36px;
}

.ep-gallery-carousel {
  position: relative; width: 100%;
  display: flex; flex-direction: column;
  height: var(--ep-gallery-h, 600px);
  background: var(--ep-black);
  font-family: var(--ep-font);
  border-radius: var(--ep-radius-lg);
  box-shadow: var(--ep-shadow-lg);
  /* Do NOT use overflow:hidden here — it clips absolute overlays (counter, arrows, expand) */
  /* Border-radius is preserved by isolating the overflow on the track only */
  isolation: isolate;         /* new stacking context so z-index works correctly */
}
/* Apply border-radius clip only to the track children, not the whole carousel */
.ep-gallery-track {
  position: relative;
  flex: 1; min-height: 0;
  overflow: hidden;
  border-radius: var(--ep-radius-lg) var(--ep-radius-lg) 0 0;
}
.ep-gallery-thumbs {
  display: flex; gap: 10px; padding: 14px 16px;
  background: #0A0A0A; height: 88px; flex-shrink: 0;
  overflow-x: auto; scrollbar-width: none;
  border-radius: 0 0 var(--ep-radius-lg) var(--ep-radius-lg);
}
.ep-gallery-slide {
  position: absolute; inset: 0;
  opacity: 0; transition: opacity .8s var(--ep-ease);
}
.ep-gallery-slide.active { opacity: 1; }
.ep-gallery-slide img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 8s linear;
  cursor: zoom-in;
}
.ep-gallery-slide.active img { transform: scale(1.06); }
.ep-gallery-slide-gradient {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.55) 0%, transparent 35%, transparent 75%, rgba(0,0,0,.25) 100%);
  pointer-events: none;
}
.ep-gallery-caption {
  position: absolute; bottom: 0; left: 0; right: 0;
  color: #fff; font-size: 13.5px; font-weight: 600;
  padding: 36px 28px 18px;
  font-family: var(--ep-font);
  letter-spacing: .01em;
}

/* Counter — absolute, anchored to carousel (not track) via z-index layering */
.ep-gallery-counter {
  position: absolute; top: 20px; left: 24px; z-index: 10;
  display: flex; align-items: baseline; gap: 6px;
  background: rgba(0,0,0,.5);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.15);
  padding: 7px 15px; border-radius: 50px;
  font-family: var(--ep-font); pointer-events: none;
}
.ep-gallery-counter-current { font-size: 14px; font-weight: 800; color: #fff; }
.ep-gallery-counter-divider { font-size: 12px; color: rgba(255,255,255,.4); }
.ep-gallery-counter-total   { font-size: 12px; color: rgba(255,255,255,.5); font-weight: 600; }

/* Expand button — top-right over the image */
.ep-gallery-expand {
  position: absolute; top: 20px; right: 24px; z-index: 10;
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(10px);
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ep-t) var(--ep-spring);
}
.ep-gallery-expand:hover {
  background: #E02E16; border-color: #E02E16;
  transform: scale(1.1);
}

/* Prev / Next — vertically centred on the track only */
.ep-gallery-carousel .ep-carousel-prev,
.ep-gallery-carousel .ep-carousel-next {
  position: absolute;
  top: calc((100% - 88px) / 2);   /* centre within track area */
  transform: translateY(-50%);
  z-index: 10;
}
.ep-gallery-carousel .ep-carousel-prev { left: 20px; }
.ep-gallery-carousel .ep-carousel-next { right: 20px; }
.ep-gallery-carousel .ep-carousel-prev:hover,
.ep-gallery-carousel .ep-carousel-next:hover {
  background: #E02E16; border-color: #E02E16;
  transform: translateY(-50%) scale(1.08);
}

/* Thumbs scrollbar already hidden by rule above */
.ep-gallery-thumbs::-webkit-scrollbar { display: none; }

.ep-thumb-btn {
  flex-shrink: 0; width: 108px; height: 60px;
  border: 2px solid transparent; border-radius: 8px;
  overflow: hidden; cursor: pointer; padding: 0;
  background: #1a1a1a;
  transition: all 0.3s var(--ep-spring);
  opacity: .55;
  position: relative;
}
.ep-thumb-btn img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ep-thumb-btn.active {
  border-color: var(--ep-red); opacity: 1;
  transform: translateY(-3px);
  box-shadow: 0 8px 20px -4px rgba(224,46,22,.5);
}
.ep-thumb-btn:hover { opacity: .9; transform: translateY(-2px); }

.ep-gallery-placeholder {
  background: var(--ep-off); border: 1px solid var(--ep-border);
  border-radius: var(--ep-radius); padding: 60px;
  text-align: center; font-size: 13px; color: var(--ep-muted);
  font-family: var(--ep-font);
}

/* ══════════════════════════════════════════════════════════
   PROJECTS / DEVELOPERS GRID
══════════════════════════════════════════════════════════ */
.ep-grid {
  display: grid;
  grid-template-columns: repeat(var(--ep-cols, 4), 1fr);
  gap: 24px;
  font-family: var(--ep-font);
}
@media(max-width:1100px){ .ep-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:580px)  { .ep-grid { grid-template-columns: 1fr; } }

/* ── Overlay card (ep_projects shortcode) ── */
.ep-card-wrap.ep-card-overlay {
  position: relative;
  display: block;
  border-radius: var(--ep-radius);
  overflow: hidden;
  aspect-ratio: 4 / 6;
  text-decoration: none;
  box-shadow: var(--ep-shadow-sm);
  background: #111;
  transition: transform 0.45s var(--ep-spring),
              box-shadow 0.45s var(--ep-ease);
}
.ep-card-wrap.ep-card-overlay:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: var(--ep-shadow-lg);
}

/* image fills the full card as background layer */
.ep-card-wrap.ep-card-overlay .ep-card-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 0.7s var(--ep-ease);
  z-index: 0;
}
.ep-card-wrap.ep-card-overlay:hover .ep-card-img { transform: scale(1.06); }
.ep-card-wrap.ep-card-overlay .ep-card-img-ph {
  position: absolute; inset: 0;
  width: 100%; height: 100%; background: var(--ep-off); z-index: 0;
}

/* gradient overlay sits above image, below text */
.ep-card-overlay-body {
  position: absolute; inset: 0;
  z-index: 1;
  display: flex; flex-direction: column;
  justify-content: space-between;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,.20) 0%,
    rgba(0,0,0,.0)  30%,
    rgba(0,0,0,.0)  45%,
    rgba(0,0,0,.65) 70%,
    rgba(0,0,0,.90) 100%
  );
  padding: 16px 18px 22px;
}

/* top row: golden visa badge only */
.ep-card-overlay-top {
  display: flex; align-items: flex-start;
}
.ep-golden-badge {
  background: rgba(0,0,0,.45);
  color: #fff; font-size: 9px; font-weight: 700;
  padding: 5px 12px; border-radius: 50px;
  letter-spacing: .1em; text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.35);
  backdrop-filter: blur(8px);
  font-family: var(--ep-font);
}

/* bottom content block */
.ep-card-overlay-bottom {
  display: flex; flex-direction: column; gap: 4px;
}
.ep-card-overlay-bottom .ep-card-title {
  font-size: 18px; font-weight: 800;
  margin: 0; line-height: 1.2;
  color: #fff;
  font-family: var(--ep-font);
  letter-spacing: -.01em;
}
.ep-card-overlay-bottom .ep-card-loc {
  font-size: 12px; color: rgba(255,255,255,.75);
  margin: 0;
  display: flex; align-items: center; gap: 5px;
  font-family: var(--ep-font);
}
.ep-card-overlay-footer {
  margin-top: 8px;
  display: flex; flex-direction: column; gap: 2px;
}
.ep-card-overlay-bottom .ep-card-price {
  font-size: 13px; font-weight: 700; color: #fff;
  margin: 0; font-family: var(--ep-font);
}
.ep-card-overlay-bottom .ep-card-meta {
  font-size: 11.5px; color: rgba(255,255,255,.65);
  margin: 0; font-family: var(--ep-font);
}

/* keep old non-overlay card styles for other uses */
.ep-card-wrap:not(.ep-card-overlay) {
  position: relative; border-radius: var(--ep-radius);
  overflow: hidden;
  border: 1px solid var(--ep-border);
  background: var(--ep-white);
  box-shadow: var(--ep-shadow-sm);
  transition: transform 0.45s var(--ep-spring),
              box-shadow 0.45s var(--ep-ease),
              border-color var(--ep-t) var(--ep-ease);
}
.ep-card-wrap:not(.ep-card-overlay):hover {
  transform: translateY(-10px) scale(1.01);
  box-shadow: var(--ep-shadow-lg);
  border-color: transparent;
}
.ep-card-wrap:not(.ep-card-overlay) .ep-card-img {
  width: 100%; height: 230px;
  object-fit: cover; display: block;
  transition: transform 0.7s var(--ep-ease);
}
.ep-card-wrap:not(.ep-card-overlay):hover .ep-card-img { transform: scale(1.08); }
.ep-card-img-ph { width: 100%; height: 230px; background: var(--ep-off); }
.ep-status-badge {
  position: absolute; top: 16px; right: 16px;
  background: rgba(0,0,0,.55); color: #fff;
  font-size: 9.5px; font-weight: 700;
  padding: 6px 13px; border-radius: 50px;
  letter-spacing: .08em; z-index: 3;
  backdrop-filter: blur(10px);
  font-family: var(--ep-font);
  border: 1px solid rgba(255,255,255,.15);
}
.ep-card-body { padding: 22px 22px 24px; }
.ep-card-title {
  font-size: 17px; font-weight: 800;
  margin: 0 0 7px; line-height: 1.25;
  font-family: var(--ep-font);
  letter-spacing: -.01em;
}
.ep-card-title a { text-decoration: none; color: var(--ep-black); transition: color var(--ep-t) var(--ep-ease); }
.ep-card-title a:hover { color: var(--ep-red); }
.ep-card-loc {
  font-size: 12.5px; color: var(--ep-muted);
  margin: 0 0 12px;
  display: flex; align-items: center; gap: 5px;
  font-family: var(--ep-font);
}
.ep-card-price {
  font-size: 17px; font-weight: 800; color: var(--ep-red);
  margin: 0 0 4px; font-family: var(--ep-font);
  letter-spacing: -.01em;
}
.ep-card-meta {
  font-size: 12.5px; color: var(--ep-muted);
  margin: 0 0 18px; font-family: var(--ep-font);
}
.ep-card-cta {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ep-red);
  text-decoration: none;
  font-family: var(--ep-font);
  transition: gap var(--ep-t) var(--ep-ease);
}
.ep-card-cta:hover { gap: 10px; }
.ep-card-cta::after { content: '→'; font-size: 13px; }

.ep-dev-logo {
  width: 100%; height: 120px;
  object-fit: contain; padding: 24px;
  background: var(--ep-off); display: block;
}

/* ══════════════════════════════════════════════════════════
   AMENITIES — HORIZONTAL SCROLLABLE TAGS + PANEL
══════════════════════════════════════════════════════════ */
.ep-amenities-wrap {
  font-family: var(--ep-font);
  padding: var(--ep-section-py) 0;
}

/* Scrollable tag strip */
.ep-amenity-tags-row {
  display: flex; gap: 10px;
  overflow-x: auto; padding: 4px 0 16px;
  scrollbar-width: none;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
.ep-amenity-tags-row::-webkit-scrollbar { display: none; }

/* Fade edges to hint scroll */
.ep-amenity-tags-outer {
  position: relative; overflow: hidden;
  padding: 0 var(--ep-section-px);
}
.ep-amenity-tags-outer::after {
  content: '';
  position: absolute; right: 0; top: 0; bottom: 0;
  width: 80px;
  background: linear-gradient(to left, var(--ep-white), transparent);
  pointer-events: none; z-index: 2;
}

.ep-amenity-tag {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 12px 22px; border-radius: 50px;
  border: 1.5px solid var(--ep-border);
  background: var(--ep-white); color: var(--ep-text);
  font-size: 13.5px; font-weight: 700;
  white-space: nowrap; cursor: pointer;
  transition: all 0.35s var(--ep-spring);
  flex-shrink: 0;
  box-shadow: var(--ep-shadow-sm);
}
.ep-amenity-tag svg, .ep-amenity-tag img.ep-amenity-tag-icon {
  width: 17px; height: 17px; flex-shrink: 0;
  color: var(--ep-muted); object-fit: contain;
  transition: color var(--ep-t) var(--ep-ease);
}
.ep-amenity-tag:hover {
  border-color: var(--ep-red);
  color: var(--ep-red);
  background: var(--ep-red-soft);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -4px rgba(224,46,22,.25);
}
.ep-amenity-tag:hover svg { color: var(--ep-red); }
.ep-amenity-tag.active {
  border-color: transparent;
  background: #E02E16;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--ep-shadow-red);
}
.ep-amenity-tag.active svg { color: #fff; }

/* Amenity panel area */
.ep-amenity-panels-wrap {
  padding: 0 var(--ep-section-px);
  margin-top: 12px;
}
.ep-amenity-panel {
  display: none;
  animation: ep-panel-in 0.5s var(--ep-ease) both;
}
.ep-amenity-panel.active {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 0;
  border-radius: var(--ep-radius-lg); overflow: hidden;
  box-shadow: var(--ep-shadow-lg);
  border: 1px solid var(--ep-border);
}
@keyframes ep-panel-in {
  from { opacity: 0; transform: translateY(20px) scale(0.99); }
  to   { opacity: 1; transform: none; }
}
@media(max-width:768px){ .ep-amenity-panel.active { grid-template-columns: 1fr; } }

.ep-amenity-img-wrap {
  overflow: hidden; min-height: 360px; max-height: 480px;
  background: var(--ep-off);
  position: relative;
}
.ep-amenity-img-wrap::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(224,46,22,.1), transparent 50%);
  pointer-events: none;
}
.ep-amenity-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform 0.8s var(--ep-ease);
}
.ep-amenity-panel:hover .ep-amenity-img-wrap img { transform: scale(1.06); }

.ep-amenity-content {
  background: var(--ep-white);
  padding: 56px 48px;
  display: flex; flex-direction: column; justify-content: center;
}
@media(max-width:768px){ .ep-amenity-content { padding: 36px 28px; } }

.ep-amenity-number {
  font-size: 12px; font-weight: 800; letter-spacing: .22em;
  text-transform: uppercase; color: var(--ep-red);
  margin-bottom: 16px;
  display: flex; align-items: center; gap: 12px;
}
.ep-amenity-number::after {
  content: ''; display: block; height: 2px; flex: 1; max-width: 60px;
  background: #E02E16; border-radius: 2px;
}
.ep-amenity-name {
  font-size: clamp(22px,2.8vw,32px); font-weight: 800;
  color: var(--ep-black); margin: 0 0 18px; line-height: 1.15;
  letter-spacing: -.02em;
}
.ep-amenity-desc {
  font-size: 15.5px; line-height: 1.85; color: var(--ep-muted);
  margin: 0;
}

/* No image fallback */
.ep-amenity-panel.active.ep-no-img { grid-template-columns: 1fr; }
.ep-amenity-panel.active.ep-no-img .ep-amenity-content {
  padding: 48px;
}

/* ══════════════════════════════════════════════════════════
   FLOOR PLANS
══════════════════════════════════════════════════════════ */
.ep-floorplans {
  font-family: var(--ep-font);
  padding: var(--ep-section-py) var(--ep-section-px);
  max-width: 1280px; margin: 0 auto;
}

.ep-fp-tabs {
  display: flex; gap: 8px;
  border-bottom: none;
  margin-bottom: 44px; flex-wrap: wrap;
  padding-bottom: 0;
}
.ep-fp-tab {
  padding: 13px 28px;
  background: var(--ep-off); border: 1.5px solid transparent;
  margin-bottom: 0;
  font-family: var(--ep-font);
  font-size: 13.5px; font-weight: 700;
  letter-spacing: .02em; color: var(--ep-muted);
  cursor: pointer;
  border-radius: 50px;
  transition: all 0.3s var(--ep-spring);
}
.ep-fp-tab:hover { color: var(--ep-text); background: #EEF0F3; transform: translateY(-1px); }
.ep-fp-tab.active {
  color: #fff;
  background: #E02E16;
  box-shadow: var(--ep-shadow-red);
  transform: translateY(-1px);
}

.ep-fp-panel { display: none; }
.ep-fp-panel.active {
  display: block;
  animation: ep-panel-in 0.4s var(--ep-ease) both;
}

.ep-fp-layout {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 64px; align-items: start;
}
@media(max-width:900px){ .ep-fp-layout { grid-template-columns: 1fr; gap: 36px; } }

.ep-fp-img {
  width: 100%; border-radius: var(--ep-radius);
  border: 1px solid var(--ep-border); display: block;
  box-shadow: var(--ep-shadow-lg);
}
.ep-fp-img-ph {
  width: 100%; aspect-ratio: 4/3;
  background: var(--ep-off); border: 1px solid var(--ep-border);
  border-radius: var(--ep-radius);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--ep-light);
  text-transform: uppercase; letter-spacing: .08em;
}

.ep-fp-specs-col {}
.ep-fp-heading {
  font-size: 22px; font-weight: 800;
  color: var(--ep-black); margin: 0 0 24px;
}

.ep-fp-table { width: 100%; border-collapse: collapse; margin-bottom: 28px; }
.ep-fp-table tr { border-bottom: 1px solid var(--ep-border); }
.ep-fp-table tr:last-child { border-bottom: none; }
.ep-fp-table td { padding: 14px 0; font-size: 14px; }
.ep-fp-td-label {
  color: var(--ep-muted); font-weight: 500;
  font-size: 12px; letter-spacing: .04em;
  text-transform: uppercase; width: 48%;
}
.ep-fp-td-val { font-weight: 700; color: var(--ep-text); text-align: right; }
.ep-fp-price-row .ep-fp-td-val {
  color: var(--ep-red);
  font-size: 16px; font-weight: 800;
}

.ep-fp-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ══════════════════════════════════════════════════════════
   PAYMENT PLAN
══════════════════════════════════════════════════════════ */
.ep-payment-wrap {
  background: var(--ep-black);
  padding: var(--ep-section-py) var(--ep-section-px);
  font-family: var(--ep-font);
}
.ep-payment-inner { max-width: 1280px; margin: 0 auto; }

.ep-payment-header { text-align: center; margin-bottom: 56px; }
.ep-payment-label {
  font-size: 11px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: rgba(255,255,255,.35);
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin-bottom: 12px;
}
.ep-payment-label::before,
.ep-payment-label::after {
  content: ''; height: 1px; width: 40px;
  background: rgba(255,255,255,.15);
}

.ep-payment-grid {
  display: grid;
  grid-template-columns: repeat(var(--ep-pay-cols, 3), 1fr);
  gap: 2px;
  border-radius: var(--ep-radius-lg); overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
}
@media(max-width:700px){ .ep-payment-grid { grid-template-columns: 1fr; } }

.ep-payment-card {
  background: rgba(255,255,255,.03);
  padding: 52px 42px;
  position: relative; overflow: hidden;
  transition: all 0.4s var(--ep-ease);
}
.ep-payment-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: #E02E16;
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.5s var(--ep-ease);
}
.ep-payment-card:hover {
  background: rgba(224,46,22,.05);
  transform: translateY(-4px);
}
.ep-payment-card:hover::before { transform: scaleX(1); }

.ep-payment-num {
  position: absolute; top: 24px; right: 28px;
  font-size: 88px; font-weight: 800;
  color: rgba(255,255,255,.035); line-height: 1;
  user-select: none; letter-spacing: -.04em;
}
.ep-payment-pct {
  font-size: clamp(56px,6.5vw,78px); font-weight: 800;
  color: var(--ep-white); line-height: 1;
  margin-bottom: 10px; letter-spacing: -.02em;
  background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.7) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ep-payment-pct-sign { font-size: .45em; vertical-align: super; -webkit-text-fill-color: var(--ep-red-light); }
.ep-payment-when {
  font-size: 11.5px; font-weight: 800; letter-spacing: .2em;
  text-transform: uppercase; color: var(--ep-red-light);
  margin-bottom: 14px;
}
.ep-payment-desc {
  font-size: 14px; line-height: 1.75;
  color: rgba(255,255,255,.45);
}
.ep-payment-ctas {
  display: flex; justify-content: center; gap: 14px;
  margin-top: 52px; flex-wrap: wrap;
}

/* ══════════════════════════════════════════════════════════
   LOCATION
══════════════════════════════════════════════════════════ */
.ep-location-wrap {
  font-family: var(--ep-font);
  padding: var(--ep-section-py) var(--ep-section-px);
  max-width: 1280px; margin: 0 auto;
}
.ep-location-grid {
  display: grid; grid-template-columns: 1.1fr 0.9fr;
  gap: 56px; align-items: start;
}
@media(max-width:900px){ .ep-location-grid { grid-template-columns: 1fr; } }

.ep-location-map {
  aspect-ratio: 4/3;
  border-radius: var(--ep-radius); overflow: hidden;
  border: 1px solid var(--ep-border);
  box-shadow: var(--ep-shadow);
}
.ep-location-map iframe { width: 100%; height: 100%; display: block; }
.ep-map-ph {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, #E8F0E8, #D0E4D0);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--ep-muted);
  text-transform: uppercase; letter-spacing: .08em;
}

.ep-dist-table { width: 100%; border-collapse: collapse; }
.ep-dist-table tr {
  border-bottom: 1px solid var(--ep-border);
  transition: background var(--ep-t) var(--ep-ease);
}
.ep-dist-table tr:last-child { border-bottom: none; }
.ep-dist-table tr:hover { background: var(--ep-off); }
.ep-dist-table td { padding: 16px 8px; font-size: 14px; vertical-align: middle; }

.ep-dist-place-cell { display: flex; align-items: center; gap: 10px; }
.ep-dist-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ep-red); flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(224,46,22,.15);
}
.ep-dist-place { font-weight: 500; color: var(--ep-text); }
.ep-dist-time {
  font-size: 14px; font-weight: 800;
  color: var(--ep-red); text-align: right;
  white-space: nowrap;
}

/* ══════════════════════════════════════════════════════════
   DEVELOPER BAND
══════════════════════════════════════════════════════════ */
.ep-dev-band {
  display: flex; align-items: center; gap: 48px; flex-wrap: wrap;
  padding: 56px var(--ep-section-px);
  border-top: 1px solid var(--ep-border);
  max-width: 1280px; margin: 0 auto;
  font-family: var(--ep-font);
}

.ep-dev-logo {
  height: 52px; width: auto; max-width: 160px;
  object-fit: contain; flex-shrink: 0;
}
.ep-dev-logo-ph {
  width: 140px; height: 52px;
  background: var(--ep-black); border-radius: var(--ep-radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; font-weight: 800; color: #fff;
  letter-spacing: .08em; flex-shrink: 0;
  font-family: var(--ep-font);
}

.ep-dev-divider {
  width: 1px; height: 60px;
  background: var(--ep-border); flex-shrink: 0;
}

.ep-dev-info { flex: 1; min-width: 200px; }
.ep-dev-name {
  font-size: 20px; font-weight: 800;
  color: var(--ep-black); margin: 0 0 4px;
}
.ep-dev-tagline {
  font-size: 13px; font-weight: 500;
  color: var(--ep-muted); margin: 0 0 6px;
}
.ep-dev-body {
  font-size: 13px; color: var(--ep-muted);
  line-height: 1.65; max-width: 420px; margin: 0;
}

.ep-dev-stats {
  display: flex; gap: 0; flex-shrink: 0;
  border: 1px solid var(--ep-border); border-radius: var(--ep-radius);
  overflow: hidden; box-shadow: var(--ep-shadow-sm);
}
.ep-dev-stat {
  text-align: center; padding: 18px 26px;
  border-right: 1px solid var(--ep-border);
  transition: all var(--ep-t) var(--ep-ease);
}
.ep-dev-stat:last-child { border-right: none; }
.ep-dev-stat:hover { background: var(--ep-red-soft); transform: translateY(-2px); }
.ep-dev-stat-val {
  font-size: 26px; font-weight: 800;
  color: var(--ep-black); line-height: 1;
  letter-spacing: -.01em;
}
.ep-dev-stat-val span { color: var(--ep-red); }
.ep-dev-stat-lbl {
  font-size: 10px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--ep-muted); margin-top: 5px;
}

/* ══════════════════════════════════════════════════════════
   ENQUIRY SECTION
══════════════════════════════════════════════════════════ */
.ep-enquiry-wrap {
  background: var(--ep-off);
  border-top: 4px solid transparent;
  border-image: var(--ep-grad-red) 1;
  padding: var(--ep-section-py) 0;
  font-family: var(--ep-font);
}
.ep-enquiry-inner {
  display: grid; grid-template-columns: 1fr 480px;
  gap: 72px; align-items: start;
  max-width: 1280px; margin: 0 auto;
  padding: 0 var(--ep-section-px);
}
@media(max-width:1100px){ .ep-enquiry-inner { grid-template-columns: 1fr; gap: 48px; } }

.ep-enquiry-copy .ep-section-title { margin-bottom: 16px; }
.ep-enquiry-copy .ep-section-body { margin-bottom: 36px; max-width: 480px; }

.ep-trust-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 0;
}
.ep-trust-list li {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 16px 0; border-bottom: 1px solid var(--ep-border);
  transition: transform var(--ep-t) var(--ep-ease);
}
.ep-trust-list li:hover { transform: translateX(4px); }
.ep-trust-list li:last-child { border-bottom: none; }

.ep-trust-icon-box {
  width: 40px; height: 40px; flex-shrink: 0;
  background: var(--ep-red-soft); border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ep-red);
  border: 1px solid rgba(224,46,22,.12);
  transition: all var(--ep-t) var(--ep-ease);
}
.ep-trust-list li:hover .ep-trust-icon-box {
  background: #E02E16; color: #fff; border-color: transparent;
  box-shadow: 0 6px 16px -2px rgba(224,46,22,.4);
}
.ep-trust-text-wrap strong {
  display: block; font-size: 13.5px; font-weight: 800;
  color: var(--ep-text); margin-bottom: 3px;
}
.ep-trust-text-wrap span { font-size: 12.5px; color: var(--ep-muted); }

.ep-enquiry-form-card {
  background: var(--ep-white);
  border: 1px solid var(--ep-border);
  border-radius: var(--ep-radius-lg);
  padding: 40px;
  box-shadow: var(--ep-shadow-lg);
  position: sticky; top: 84px;
}
.ep-form-title {
  font-size: 24px; font-weight: 800;
  color: var(--ep-black); margin: 0 0 5px;
  letter-spacing: -.01em;
}
.ep-form-sub {
  font-size: 12.5px; color: var(--ep-muted);
  margin: 0 0 26px; line-height: 1.6;
}
.ep-form-sub strong { color: var(--ep-red); }
.ep-form-placeholder {
  background: var(--ep-off);
  border: 1.5px dashed var(--ep-border);
  border-radius: var(--ep-radius-sm);
  padding: 28px; text-align: center;
  font-size: 13px; color: var(--ep-muted);
}

/* ══════════════════════════════════════════════════════════
   FLOATING WHATSAPP
══════════════════════════════════════════════════════════ */
.ep-wa-float {
  position: fixed; bottom: 28px; right: 28px; z-index: 9999;
  display: flex; align-items: center; gap: 10px;
  background: var(--ep-wa); color: #fff;
  padding: 14px 22px; border-radius: 50px;
  text-decoration: none; font-family: var(--ep-font);
  font-size: 13px; font-weight: 700;
  box-shadow: 0 6px 24px rgba(37,211,102,.5);
  transition: transform var(--ep-t) var(--ep-spring),
              box-shadow var(--ep-t) var(--ep-ease);
  animation: ep-wa-bounce 3s 2s ease-in-out infinite;
}
.ep-wa-float:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 12px 32px rgba(37,211,102,.6);
  color: #fff;
}
@keyframes ep-wa-bounce {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-4px); }
}


/* ══════════════════════════════════════════════════════════
   HERO — TRUST BADGES
══════════════════════════════════════════════════════════ */
.ep-hero-trust {
  display: flex; flex-wrap: wrap; gap: 10px;
  margin-top: 24px;
}
.ep-trust-badge {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  backdrop-filter: blur(10px);
  color: rgba(255,255,255,.85);
  font-size: 12px; font-weight: 600;
  padding: 7px 14px; border-radius: 50px;
  font-family: var(--ep-font);
  transition: all var(--ep-t) var(--ep-ease);
}
.ep-trust-badge svg { color: #4ade80; flex-shrink: 0; }
.ep-trust-badge:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.3);
}

/* ══════════════════════════════════════════════════════════
   INVESTMENT HIGHLIGHTS GRID
══════════════════════════════════════════════════════════ */
.ep-inv-highlights {
  background: #111111;
  padding: var(--ep-section-py) var(--ep-section-px);
  font-family: var(--ep-font);
}
.ep-inv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 2px;
  max-width: 1280px; margin: 0 auto;
  border-radius: var(--ep-radius-lg); overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
}
.ep-inv-card {
  background: rgba(255,255,255,.03);
  padding: 40px 30px;
  display: flex; flex-direction: column; align-items: flex-start;
  position: relative; overflow: hidden;
  transition: all 0.4s var(--ep-ease);
}
.ep-inv-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: #E02E16;
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.5s var(--ep-ease);
}
.ep-inv-card:hover { background: rgba(224,46,22,.05); transform: translateY(-4px); }
.ep-inv-card:hover::before { transform: scaleX(1); }

.ep-inv-icon {
  width: 48px; height: 48px; margin-bottom: 22px;
  background: rgba(224,46,22,.1); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ep-red-light);
  border: 1px solid rgba(224,46,22,.15);
  transition: all 0.35s var(--ep-spring);
}
.ep-inv-card:hover .ep-inv-icon {
  background: #E02E16; color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 24px -4px rgba(224,46,22,.5);
  transform: scale(1.08) rotate(-4deg);
}

.ep-inv-value {
  font-family: var(--ep-font);
  font-size: clamp(26px,3.2vw,38px); font-weight: 800;
  color: #fff; line-height: 1; margin-bottom: 8px;
  letter-spacing: -.025em;
}
.ep-inv-label {
  font-size: 12.5px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.55);
}
.ep-inv-sub {
  font-size: 11.5px; color: rgba(255,255,255,.32);
  margin-top: 5px; font-weight: 500;
}

@media(max-width:600px){ .ep-inv-grid { grid-template-columns: repeat(2,1fr); } }

/* ══════════════════════════════════════════════════════════
   EDITORIAL / STORYTELLING SECTION
══════════════════════════════════════════════════════════ */
.ep-editorial {
  background: var(--ep-white);
  padding: var(--ep-section-py) 0;
  font-family: var(--ep-font);
}
.ep-editorial-inner {
  display: grid; grid-template-columns: 1fr 1fr;
  max-width: 1280px; margin: 0 auto;
  padding: 0 var(--ep-section-px);
  gap: 80px; align-items: center;
}
@media(max-width:900px){ .ep-editorial-inner { grid-template-columns: 1fr; gap: 48px; } }

.ep-editorial-img {
  position: relative;
}
.ep-editorial-img img,
.ep-editorial-img-ph {
  width: 100%; aspect-ratio: 3/4;
  object-fit: cover; display: block;
  border-radius: var(--ep-radius-lg);
  background: var(--ep-off);
  box-shadow: var(--ep-shadow-lg);
}
.ep-editorial-stats {
  position: absolute; bottom: -28px; right: -28px;
  background: #111111;
  border-radius: var(--ep-radius); overflow: hidden;
  display: flex; box-shadow: 0 24px 60px -12px rgba(0,0,0,.5);
  border: 1px solid rgba(255,255,255,.1);
}
@media(max-width:600px){
  .ep-editorial-stats { position: static; margin-top: 18px; border-radius: var(--ep-radius); }
}
.ep-editorial-stat {
  padding: 22px 26px; text-align: center;
  border-right: 1px solid rgba(255,255,255,.08);
  transition: background var(--ep-t) var(--ep-ease);
}
.ep-editorial-stat:hover { background: rgba(224,46,22,.1); }
.ep-editorial-stat:last-child { border-right: none; }
.ep-editorial-stat-val {
  font-size: 23px; font-weight: 800; color: #fff; line-height: 1;
  letter-spacing: -.01em;
}
.ep-editorial-stat-lbl {
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.45); margin-top: 5px;
}

.ep-editorial-content { padding-left: 8px; }
.ep-editorial-quote {
  position: relative; margin: 0 0 30px;
  padding: 0 0 0 32px;
  border-left: 4px solid transparent;
  border-image: var(--ep-grad-red) 1;
  font-size: clamp(22px,2.7vw,30px); font-weight: 800;
  color: var(--ep-black); line-height: 1.3;
  letter-spacing: -.015em; font-style: normal;
}
.ep-editorial-quote-mark {
  position: absolute; left: -16px; top: -20px;
  font-size: 90px;
  background: #E02E16;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; opacity: .25;
  font-family: Georgia, serif; line-height: 1; user-select: none;
}
.ep-editorial-body { font-size: 15.5px; line-height: 1.9; color: var(--ep-muted); }
.ep-editorial-body p { margin-bottom: 16px; }
.ep-editorial-body p:last-child { margin-bottom: 0; }

/* ══════════════════════════════════════════════════════════
   MASTERPLAN WITH HOTSPOTS
══════════════════════════════════════════════════════════ */
.ep-masterplan {
  background: var(--ep-off);
  padding: var(--ep-section-py) var(--ep-section-px);
  font-family: var(--ep-font);
}
.ep-masterplan-header {
  text-align: center;
  max-width: 640px; margin: 0 auto 48px;
}

.ep-masterplan-wrap {
  position: relative; max-width: 1280px; margin: 0 auto;
  border-radius: var(--ep-radius); overflow: hidden;
  box-shadow: var(--ep-shadow-lg);
  user-select: none;
}
.ep-masterplan-img {
  width: 100%; display: block;
  border-radius: var(--ep-radius);
}

/* Hotspot */
.ep-hotspot {
  position: absolute; transform: translate(-50%, -50%);
  cursor: pointer; z-index: 5;
}
.ep-hotspot-dot {
  width: 14px; height: 14px; background: var(--ep-red);
  border: 2.5px solid #fff; border-radius: 50%;
  display: block; position: relative; z-index: 2;
  box-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.ep-hotspot-pulse {
  position: absolute; top: 50%; left: 50%;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(224,46,22,.3);
  transform: translate(-50%,-50%);
  animation: ep-pulse 2s ease-out infinite;
}
@keyframes ep-pulse {
  0%   { transform: translate(-50%,-50%) scale(0.5); opacity: 1; }
  100% { transform: translate(-50%,-50%) scale(2.2); opacity: 0; }
}
.ep-hotspot-card {
  position: absolute; bottom: calc(100% + 12px); left: 50%;
  transform: translateX(-50%) translateY(6px);
  background: var(--ep-black); color: #fff;
  font-size: 12px; font-weight: 600; letter-spacing: .04em;
  padding: 8px 14px; border-radius: 6px;
  white-space: nowrap; pointer-events: none;
  display: flex; align-items: center; gap: 6px;
  opacity: 0; transition: all 0.25s var(--ep-ease);
  box-shadow: var(--ep-shadow);
}
.ep-hotspot-card::after {
  content: ''; position: absolute; top: 100%; left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: var(--ep-black);
}
.ep-hotspot:hover .ep-hotspot-card {
  opacity: 1; transform: translateX(-50%) translateY(0);
}

/* ══════════════════════════════════════════════════════════
   ROI CALCULATOR
══════════════════════════════════════════════════════════ */
.ep-roi-wrap {
  background: #111111;
  padding: var(--ep-section-py) 0;
  font-family: var(--ep-font);
  position: relative; overflow: hidden;
}
.ep-roi-wrap::before {
  content: '';
  position: absolute; top: -10%; left: -5%;
  width: 45%; height: 60%;
  background: radial-gradient(circle, rgba(224,46,22,.12) 0%, transparent 70%);
  pointer-events: none;
}
.ep-roi-inner {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 80px; align-items: center;
  max-width: 1280px; margin: 0 auto;
  padding: 0 var(--ep-section-px);
  position: relative; z-index: 1;
}
@media(max-width:900px){ .ep-roi-inner { grid-template-columns: 1fr; gap: 48px; } }

.ep-roi-left .ep-eyebrow { color: var(--ep-red-light); }
.ep-roi-disclaimer {
  font-size: 11.5px; color: rgba(255,255,255,.3);
  line-height: 1.7; margin-top: 28px;
  padding-left: 16px; border-left: 2px solid rgba(255,255,255,.1);
}

.ep-roi-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--ep-radius-lg); padding: 40px;
  backdrop-filter: blur(20px) saturate(1.5);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.1);
}

.ep-roi-field { margin-bottom: 26px; }
.ep-roi-field label {
  display: block; font-size: 11.5px; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.55); margin-bottom: 14px;
}
.ep-roi-input-wrap {
  display: flex; align-items: center; gap: 16px;
}
.ep-roi-slider {
  flex: 1; -webkit-appearance: none; appearance: none;
  height: 5px; background: rgba(255,255,255,.15);
  border-radius: 3px; outline: none; cursor: pointer;
}
.ep-roi-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 22px; height: 22px; border-radius: 50%;
  background: #E02E16; cursor: pointer;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px rgba(224,46,22,.55);
  transition: transform 0.25s var(--ep-spring);
}
.ep-roi-slider::-webkit-slider-thumb:hover { transform: scale(1.25); }
.ep-roi-slider::-moz-range-thumb {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--ep-red); cursor: pointer;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px rgba(224,46,22,.55);
}
.ep-roi-amount-display {
  font-size: 15px; font-weight: 800; color: #fff;
  white-space: nowrap; min-width: 110px; text-align: right;
  letter-spacing: -.01em;
}

.ep-roi-results {
  background: rgba(0,0,0,.35);
  border-radius: var(--ep-radius); padding: 24px;
  margin-bottom: 26px;
  border: 1px solid rgba(255,255,255,.08);
}
.ep-roi-result-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.07);
}
.ep-roi-result-item:last-child { border-bottom: none; padding-bottom: 0; }
.ep-roi-result-label {
  font-size: 12.5px; color: rgba(255,255,255,.5); font-weight: 600;
}
.ep-roi-result-val {
  font-size: 15px; font-weight: 800; color: #fff;
}
.ep-roi-result-highlight .ep-roi-result-label { color: rgba(255,255,255,.8); }
.ep-roi-result-big {
  font-size: 24px;
  background: linear-gradient(135deg, #4ade80, #22c55e);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ep-roi-ctas { display: flex; gap: 12px; }
@media(max-width:480px){ .ep-roi-ctas { flex-direction: column; } }

/* ══════════════════════════════════════════════════════════
   GALLERY — FULLSCREEN LIGHTBOX
══════════════════════════════════════════════════════════ */
.ep-gallery-lightbox {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(5,5,8,.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  display: none !important;
  align-items: center; justify-content: center;
  font-family: var(--ep-font);
}
.ep-gallery-lightbox.ep-lightbox-open {
  display: flex !important;
  animation: ep-lightbox-fade 0.3s var(--ep-ease);
}
@keyframes ep-lightbox-fade {
  from { opacity: 0; } to { opacity: 1; }
}
.ep-lightbox-img-wrap {
  max-width: 90vw; max-height: 86vh;
  display: flex; align-items: center; justify-content: center;
}
.ep-lightbox-img-wrap img {
  max-width: 100%; max-height: 86vh;
  object-fit: contain; border-radius: var(--ep-radius-sm);
  box-shadow: 0 40px 100px rgba(0,0,0,.6);
}
.ep-lightbox-close {
  position: absolute; top: 28px; right: 28px;
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ep-t) var(--ep-spring);
  z-index: 2;
}
.ep-lightbox-close:hover { background: #E02E16; border-color: transparent; transform: rotate(90deg); }

.ep-lightbox-prev, .ep-lightbox-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ep-t) var(--ep-spring);
  z-index: 2;
}
.ep-lightbox-prev { left: 28px; }
.ep-lightbox-next { right: 28px; }
.ep-lightbox-prev:hover, .ep-lightbox-next:hover {
  background: #E02E16; border-color: transparent;
  transform: translateY(-50%) scale(1.1);
}
@media(max-width:700px){
  .ep-lightbox-prev, .ep-lightbox-next { width: 44px; height: 44px; }
  .ep-lightbox-prev { left: 12px; } .ep-lightbox-next { right: 12px; }
  .ep-lightbox-close { top: 16px; right: 16px; }
}