/* =========================================================================
   Marcus Miller — static-build overrides on top of the compiled Realton CSS.
   Neutralizes the React/Swiper carousels into plain wrapped grids (no JS lib),
   adds sticky/solid nav, a mobile menu, legal-page styling, and the pager.
   ========================================================================= */

/* ---- kill any template preloader (no React to hide it) ---- */
#preloader, .preloader, .preloader3 { display: none !important; }

/* ---- AOS (Animate On Scroll) is JS-driven; without its lib every [data-aos]
        element stays at opacity:0. Force them visible for the static build. ---- */
[data-aos] { opacity: 1 !important; transform: none !important; visibility: visible !important; }
.aos-init, .aos-animate { opacity: 1 !important; transform: none !important; }

/* ---- Swiper carousels -> static wrapped grids ---- */
.swiper, .swiper-container { overflow: visible !important; }
.swiper-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  transform: none !important;
  transition: none !important;
  gap: 24px;
  height: auto !important;
  justify-content: center;
}
.swiper-slide {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100%;
  height: auto !important;
  margin: 0 !important;
}
/* keep listing/city cards a sensible size when they wrap */
.property-city-slider .swiper-slide { width: 300px !important; }
.testimonial-slider .swiper-slide { width: 100%; max-width: 560px; }

/* ---- sticky / solid nav on scroll ---- */
header.header-nav { transition: background .3s ease, box-shadow .3s ease; }
/* solid = colours only (safe on inner pages, no layout shift) */
header.header-nav.mm-solid {
  background: #fff !important; box-shadow: 0 6px 24px rgba(0,0,0,.08);
  backdrop-filter: none !important;
}
/* stick = fixed positioning (home page, on scroll only) */
header.header-nav.mm-stick {
  position: fixed !important; top: 0; left: 0; right: 0; z-index: 1000;
  animation: mmSlideDown .35s ease;
}
@keyframes mmSlideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }
header.header-nav.mm-solid .list-item,
header.header-nav.mm-solid .list-item .title,
header.header-nav.mm-solid .login-info,
header.header-nav.mm-solid .login-info span { color: #181a20 !important; text-shadow: none !important; }
header.header-nav.mm-solid .list-item.menuActive,
header.header-nav.mm-solid .list-item.menuActive .title { color: #eb6753 !important; }
header.header-nav .logo2 { display: none; }
header.header-nav.mm-solid .logo1 { display: none; }
header.header-nav.mm-solid .logo2 { display: inline-block; }

/* ---- mobile menu (injected) ---- */
.mm-burger {
  display: none; width: 44px; height: 40px; margin-left: 14px; border: 0; border-radius: 8px;
  background: rgba(255,255,255,.14); cursor: pointer; flex-direction: column; gap: 5px;
  align-items: center; justify-content: center; padding: 0;
}
.mm-burger span { display: block; width: 22px; height: 2px; background: currentColor; border-radius: 2px; transition: .25s; }
header.header-nav .mm-burger { color: #fff; }
header.header-nav.mm-solid .mm-burger { color: #181a20; background: rgba(0,0,0,.06); }
/* fixed fallback burger for pages without the template mobile bar (legal pages) */
.mm-burger-fixed { position: fixed; top: 16px; right: 16px; z-index: 1301; color: #fff; background: rgba(24,26,32,.9); }
@media (min-width: 992px) { .mm-burger-fixed { display: none !important; } }
.mm-mobile-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1200;
  background: #181a20; padding: 84px 24px 28px; transform: translateY(-100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1); box-shadow: 0 20px 50px rgba(0,0,0,.35);
}
body.mm-menu-open .mm-mobile-nav { transform: translateY(0); }
.mm-mobile-inner { display: flex; flex-direction: column; gap: 4px; max-width: 480px; margin: 0 auto; }
.mm-mobile-inner a {
  color: #fff; font-family: "Poppins", sans-serif; font-size: 17px; font-weight: 500;
  padding: 13px 6px; border-bottom: 1px solid rgba(255,255,255,.08); text-decoration: none;
}
.mm-mobile-inner a.active { color: #eb6753; }
.mm-mobile-call { margin-top: 16px; border: 0 !important; background: #eb6753; color: #fff !important;
  text-align: center; border-radius: 10px; font-weight: 600 !important; }
body.mm-menu-open { overflow: hidden; }
body.mm-menu-open::after { content: ""; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1150; }
@media (max-width: 991px) {
  .mm-burger { display: flex; }
  header.header-nav .ace-responsive-menu { display: none !important; }
}
@media (min-width: 992px) { .mm-mobile-nav { display: none; } }

/* ---- listings pager ---- */
.mm-page {
  min-width: 42px; height: 42px; padding: 0 12px; border: 1px solid #e6e8ec; background: #fff;
  border-radius: 8px; color: #181a20; font-weight: 500; cursor: pointer; transition: .2s;
}
.mm-page:hover:not(:disabled) { border-color: #eb6753; color: #eb6753; }
.mm-page.active { background: #eb6753; border-color: #eb6753; color: #fff; }
.mm-page:disabled { opacity: .45; cursor: default; }

/* ---- legal pages ---- */
.mm-legal-banner { background: #181a20; padding: 150px 0 60px; }
.mm-legal-banner h1 { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 40px; margin: 0; }
.mm-legal { background: #fff; }
.mm-legal-body { color: #4b4f57; font-size: 15.5px; line-height: 1.85; font-family: "Poppins", sans-serif; }
.mm-legal-body h1 { font-size: 30px; }
.mm-legal-body h2 { font-size: 23px; margin: 34px 0 12px; color: #181a20; font-weight: 600; }
.mm-legal-body h3 { font-size: 18px; margin: 24px 0 10px; color: #181a20; font-weight: 600; }
.mm-legal-body p { margin: 0 0 16px; }
.mm-legal-body a { color: #eb6753; }
.mm-legal-list { margin: 0 0 18px; padding-left: 20px; }
.mm-legal-list li { margin-bottom: 8px; }
.mm-legal-eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: 13px; color: #eb6753; font-weight: 600; margin-bottom: 24px; }

/* spacing helpers used above (in case the template lacks them) */
.pt50 { padding-top: 50px; } .pt60 { padding-top: 60px; } .pb60 { padding-bottom: 60px; }
.mt10 { margin-top: 10px; } .mt20 { margin-top: 20px; } .mt30 { margin-top: 30px; }
