/* ==========================================================================
   MovePro UAE — Design System
   Bootstrap 5 is loaded first; this file layers brand tokens + components.
   The legacy --navy / --amber variables remain as aliases so older pages
   continue to work while the site is migrated to the MovePro visual system.
   ========================================================================== */


/* ==========================================================================
   1. DESIGN TOKENS
   ========================================================================== */

:root{
  /* MovePro brand */
  --brand-red:#B4232C;
  --brand-red-dark:#861923;
  --brand-red-deep:#65121A;
  --brand-red-soft:#FFF1F2;
  --brand-red-soft-2:#FDE7E9;

  --charcoal:#17212B;
  --charcoal-2:#22303D;
  --charcoal-soft:#314252;

  --warm-bg:#FAF8F7;
  --surface:#FFFFFF;
  --surface-soft:#F6F3F2;

  --text:#1D2732;
  --text-2:#66707C;
  --text-3:#8A939D;

  --border:#E9E4E2;
  --border-strong:#DDD5D2;

  --success:#1E9B65;
  --whatsapp:#25D366;

  /*
     Legacy aliases.
     Keeping these avoids breaking older service/about/contact pages
     that still reference the old MoveMax variable names.
  */
  --navy:var(--charcoal);
  --navy-2:var(--charcoal-2);
  --navy-soft:var(--charcoal-soft);

  --amber:var(--brand-red);
  --amber-2:var(--brand-red-dark);

  --bg:var(--warm-bg);

  --font-head:'Plus Jakarta Sans', 'Manrope', sans-serif;
  --font-body:'Inter', sans-serif;

  --radius-xs:8px;
  --radius-sm:12px;
  --radius-md:18px;
  --radius-lg:26px;
  --radius-xl:34px;

  --shadow-xs:0 1px 2px rgba(23,33,43,.05);
  --shadow-sm:0 4px 14px rgba(23,33,43,.07);
  --shadow-md:0 14px 34px rgba(23,33,43,.10);
  --shadow-lg:0 28px 60px rgba(23,33,43,.14);
  --shadow-red:0 16px 34px rgba(180,35,44,.22);

  --container-max:1280px;
}


/* ==========================================================================
   2. BASE
   ========================================================================== */

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
  scroll-padding-top:88px;
}

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body,
input,
textarea,
select,
button{
  font-family:var(--font-body);
}

h1,
h2,
h3,
h4,
h5,
h6{
  font-family:var(--font-head);
  color:var(--charcoal);
  font-weight:800;
  letter-spacing:-0.025em;
  margin-bottom:0;
}

p{
  color:var(--text-2);
  margin-bottom:0;
}

a{
  text-decoration:none;
  color:inherit;
}

img{
  max-width:100%;
}

::selection{
  background:var(--brand-red);
  color:#fff;
}


/* ==========================================================================
   3. LAYOUT / TYPOGRAPHY
   ========================================================================== */

.container-xl-custom{
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:1.25rem;
}

@media (min-width:768px){
  .container-xl-custom{
    padding-inline:2rem;
  }
}

@media (min-width:1200px){
  .container-xl-custom{
    padding-inline:2.5rem;
  }
}

.section-pad{
  padding-block:clamp(4rem, 6vw, 6.75rem);
}

.section-pad-sm{
  padding-block:clamp(3rem, 4.5vw, 4.75rem);
}

.section-head{
  max-width:720px;
  margin-bottom:clamp(2rem, 4vw, 3.5rem);
}

.section-head.mx-auto{
  text-align:center;
}

.h-display{
  font-size:clamp(2.45rem, 5vw, 4.35rem);
  line-height:1.03;
  letter-spacing:-.045em;
}

.h-section{
  font-size:clamp(1.85rem, 3vw, 2.65rem);
  line-height:1.13;
  letter-spacing:-.035em;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-family:var(--font-head);
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--brand-red);
}

.eyebrow::before{
  content:"";
  width:24px;
  height:2px;
  border-radius:100px;
  background:var(--brand-red);
  display:inline-block;
}

.text-brand-red{
  color:var(--brand-red) !important;
}

/* Legacy utility retained */
.text-amber{
  color:var(--brand-red) !important;
}

.bg-navy{
  background:var(--charcoal) !important;
}

.rounded-xl{
  border-radius:var(--radius-lg) !important;
}

.mm-surface-section{
  background:var(--surface-soft);
  border-block:1px solid var(--border);
}


/* ==========================================================================
   4. BUTTONS
   ========================================================================== */

.btn{
  font-family:var(--font-head);
  font-weight:800;
  border-radius:var(--radius-sm);
  padding:.88rem 1.5rem;
  font-size:.93rem;
  line-height:1.2;
  border:1px solid transparent;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background-color .18s ease,
    color .18s ease,
    border-color .18s ease;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn:active{
  transform:translateY(1px);
}

.btn-brand-red,
.btn-amber{
  background:var(--brand-red);
  color:#fff;
  border-color:var(--brand-red);
  box-shadow:var(--shadow-red);
}

.btn-brand-red:hover,
.btn-amber:hover{
  background:var(--brand-red-dark);
  border-color:var(--brand-red-dark);
  color:#fff;
  box-shadow:0 18px 38px rgba(134,25,35,.24);
}

.btn-outline-brand{
  background:#fff;
  color:var(--charcoal);
  border:1.5px solid var(--border-strong);
  box-shadow:var(--shadow-xs);
}

.btn-outline-brand:hover{
  background:var(--brand-red-soft);
  color:var(--brand-red);
  border-color:rgba(180,35,44,.35);
}

.btn-navy{
  background:var(--charcoal);
  color:#fff;
}

.btn-navy:hover{
  background:var(--charcoal-2);
  color:#fff;
}

.btn-outline-light-custom{
  background:transparent;
  color:#fff;
  border:1.5px solid rgba(255,255,255,.4);
}

.btn-outline-light-custom:hover{
  background:rgba(255,255,255,.1);
  color:#fff;
}

.btn-ghost-navy{
  background:transparent;
  color:var(--charcoal);
  border:1.5px solid var(--border);
}

.btn-ghost-navy:hover{
  background:var(--charcoal);
  color:#fff;
  border-color:var(--charcoal);
}

.btn-sm-pill{
  border-radius:100px;
  padding:.68rem 1.15rem;
  font-size:.84rem;
}

.btn-light{
  background:#fff;
  color:var(--brand-red);
  border-color:#fff;
  box-shadow:var(--shadow-sm);
}

.btn-light:hover{
  background:var(--brand-red-soft);
  border-color:var(--brand-red-soft);
  color:var(--brand-red-dark);
}


/* ==========================================================================
   5. NAVBAR / HEADER
   ========================================================================== */

.mm-navbar{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(18px);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid rgba(233,228,226,.95);
  transition:
    box-shadow .2s ease,
    background-color .2s ease;
}

.mm-navbar.is-scrolled{
  background:rgba(255,255,255,.97);
  box-shadow:0 8px 24px rgba(23,33,43,.07);
}

.mm-brand{
  display:flex;
  align-items:center;
  gap:.72rem;
  color:var(--charcoal);
  min-width:max-content;
}

.mm-brand-mark{
  width:42px;
  height:42px;
  border-radius:13px;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(180,35,44,.2);
}

.mm-brand-mark svg{
  width:22px;
  height:22px;
  stroke:#fff !important;
}

.mm-brand-mark svg circle{
  fill:#fff !important;
}

.mm-brand-content{
  display:flex;
  flex-direction:column;
  line-height:1.05;
}

.mm-brand-name{
  display:block;
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.12rem;
  letter-spacing:-.035em;
  color:var(--charcoal);
}

.mm-brand small{
  display:block;
  margin-top:.28rem;
  font-family:var(--font-body);
  font-weight:600;
  font-size:.61rem;
  color:var(--text-2);
  letter-spacing:.025em;
}

.mm-nav-link{
  position:relative;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.89rem;
  color:var(--text);
  padding:.55rem .78rem !important;
  border-radius:9px;
  transition:
    color .15s ease,
    background-color .15s ease;
}

.mm-nav-link:hover{
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mm-nav-link.active{
  color:var(--brand-red) !important;
  background:rgba(180,35,44,.07);
}

.mm-nav-link.active::after{
  content:"";
  position:absolute;
  left:.78rem;
  right:.78rem;
  bottom:.18rem;
  height:2px;
  border-radius:100px;
  background:var(--brand-red);
}

.mm-nav-phone{
  display:flex;
  align-items:center;
  gap:.48rem;
  font-family:var(--font-head);
  font-weight:800;
  font-size:.84rem;
  color:var(--charcoal);
  white-space:nowrap;
}

.mm-nav-phone:hover{
  color:var(--brand-red);
}

.mm-nav-phone-icon{
  width:30px;
  height:30px;
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mm-dropdown{
  margin-top:.65rem !important;
  min-width:240px;
  padding:.55rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:var(--shadow-md);
}

.mm-dropdown .dropdown-item{
  border-radius:9px;
  padding:.7rem .8rem;
  color:var(--text);
  font-size:.86rem;
  font-weight:600;
  transition:
    color .15s ease,
    background-color .15s ease;
}

.mm-dropdown .dropdown-item:hover,
.mm-dropdown .dropdown-item:focus{
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mm-dropdown .dropdown-item.active{
  background:var(--brand-red);
  color:#fff;
}

.navbar-toggler{
  padding:.5rem;
  border-radius:10px;
}

.navbar-toggler:focus{
  box-shadow:none;
}

@media (max-width:991.98px){
  .mm-navbar .navbar-collapse{
    margin-top:.75rem;
    padding:1rem;
    background:#fff;
    border:1px solid var(--border);
    border-radius:16px;
    box-shadow:var(--shadow-md);
  }

  .mm-nav-link{
    padding:.72rem .8rem !important;
  }

  .mm-nav-link.active::after{
    display:none;
  }

  .mm-dropdown{
    margin-top:.3rem !important;
    box-shadow:none;
    border-color:var(--border);
  }
}


/* ==========================================================================
   6. MOVEPRO HERO
   ========================================================================== */

.mm-hero{
  position:relative;
  overflow:hidden;
}

/*
   MovePro homepage hero intentionally uses a light background.
   This differentiates it from the old MoveMax dark navy hero and gives
   the red brand room to feel premium rather than aggressive.
*/
.mm-hero-movepro{
  background:
    radial-gradient(circle at 8% 10%, rgba(180,35,44,.07), transparent 28%),
    radial-gradient(circle at 90% 8%, rgba(180,35,44,.08), transparent 22%),
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
  color:var(--text);
  padding-block:clamp(3.25rem, 6.5vw, 6.5rem);
}

.mm-hero-movepro::before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  border:1px solid rgba(180,35,44,.08);
  border-radius:50%;
  left:-190px;
  bottom:-180px;
  pointer-events:none;
}

.mm-hero-movepro h1{
  color:var(--charcoal);
  max-width:690px;
}

.mm-hero-movepro .lead-text{
  color:var(--text-2);
  font-size:clamp(1rem, 1.4vw, 1.1rem);
  line-height:1.75;
  max-width:620px;
}

.mm-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  width:max-content;
  max-width:100%;
  padding:.5rem .9rem;
  border-radius:100px;
  background:var(--brand-red-soft);
  border:1px solid rgba(180,35,44,.14);
  color:var(--brand-red);
  font-size:.76rem;
  font-weight:800;
  font-family:var(--font-head);
  letter-spacing:.02em;
}

.mm-hero-badge .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--brand-red);
  box-shadow:0 0 0 4px rgba(180,35,44,.11);
  flex-shrink:0;
}

.mm-hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem 1rem;
  margin-top:.2rem;
}

.mm-hero-points span{
  display:inline-flex;
  align-items:center;
  gap:.46rem;
  color:var(--charcoal-soft);
  font-size:.82rem;
  font-weight:700;
}

.mm-hero-points svg{
  width:18px;
  height:18px;
  padding:3px;
  border-radius:50%;
  background:var(--brand-red-soft);
  stroke:var(--brand-red);
  stroke-width:3;
  fill:none;
  flex-shrink:0;
}


/* ---------- Hero visual / image slider ---------- */

.mm-hero-visual{
  position:relative;
  max-width:620px;
  margin-left:auto;
  padding:1rem 0 1.1rem 1rem;
}

.mm-hero-shape{
  position:absolute;
  width:78%;
  height:86%;
  right:-3%;
  top:-2%;
  border-radius:32px;
  background:
    linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
  transform:rotate(4deg);
  opacity:.96;
}

.mm-hero-shape::after{
  content:"";
  position:absolute;
  width:82px;
  height:82px;
  right:-24px;
  bottom:-25px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.38);
}

.mm-hero-carousel{
  position:relative;
  z-index:2;
  overflow:hidden;
  border-radius:26px;
  background:var(--charcoal);
  box-shadow:0 32px 70px rgba(23,33,43,.2);
}

.mm-hero-carousel .carousel-inner{
  overflow:hidden;
}

.mm-hero-slide{
  position:relative;
  height:clamp(440px, 47vw, 590px);
  min-height:440px;
  overflow:hidden;
}

.mm-hero-slide::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, transparent 48%, rgba(12,18,24,.82) 100%);
  pointer-events:none;
}

.mm-hero-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  transform:scale(1.01);
  transition:transform 5.8s ease;
}

.mm-hero-carousel .carousel-item.active .mm-hero-slide img{
  transform:scale(1.055);
}

.mm-slide-label{
  position:absolute;
  z-index:3;
  left:1.25rem;
  right:1.25rem;
  bottom:1.4rem;
  display:flex;
  align-items:center;
  gap:.9rem;
  color:#fff;
}

.mm-slide-label > span{
  width:42px;
  height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:var(--brand-red);
  font-family:var(--font-head);
  font-weight:800;
  font-size:.75rem;
}

.mm-slide-label strong{
  display:block;
  font-family:var(--font-head);
  font-size:.96rem;
  font-weight:800;
  line-height:1.2;
}

.mm-slide-label small{
  display:block;
  margin-top:.2rem;
  color:rgba(255,255,255,.72);
  font-size:.75rem;
}

.mm-carousel-controls{
  position:absolute;
  z-index:5;
  top:1.1rem;
  left:1.1rem;
  right:1.1rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  pointer-events:none;
}

.mm-carousel-controls .carousel-indicators{
  position:static;
  margin:0;
  display:flex;
  gap:.35rem;
  pointer-events:auto;
}

.mm-carousel-controls .carousel-indicators [data-bs-target]{
  width:7px;
  height:7px;
  margin:0;
  border:0;
  border-radius:100px;
  background:rgba(255,255,255,.58);
  opacity:1;
  transition:width .2s ease, background-color .2s ease;
}

.mm-carousel-controls .carousel-indicators .active{
  width:28px;
  background:#fff;
}

.mm-carousel-arrows{
  display:flex;
  gap:.45rem;
  pointer-events:auto;
}

.mm-carousel-arrows button{
  width:36px;
  height:36px;
  padding:0;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(17,24,32,.42);
  color:#fff;
  backdrop-filter:blur(7px);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:
    background-color .18s ease,
    transform .18s ease;
}

.mm-carousel-arrows button:hover{
  background:var(--brand-red);
  transform:translateY(-1px);
}

.mm-carousel-arrows svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
}

.mm-hero-service-note{
  position:absolute;
  z-index:4;
  left:-18px;
  bottom:-18px;
  max-width:310px;
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.9rem 1rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow-md);
}

.mm-hero-service-note-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  color:#fff;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
}

.mm-hero-service-note-icon svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
}

.mm-hero-service-note strong{
  display:block;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.8rem;
  font-weight:800;
  line-height:1.25;
}

.mm-hero-service-note small{
  display:block;
  margin-top:.15rem;
  color:var(--text-2);
  font-size:.68rem;
}


/* ==========================================================================
   7. TRUST BAR
   ========================================================================== */

.mm-trustbar{
  background:var(--charcoal);
  border:0;
}

.mm-trust-item{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  min-height:36px;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.82rem;
  color:rgba(255,255,255,.9);
}

.mm-trust-item .icon{
  width:22px;
  height:22px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-size:.72rem;
}


/* ==========================================================================
   8. QUOTE SECTION / FORM
   ========================================================================== */

.mm-quote-section{
  position:relative;
  background:
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
}

.mm-quote-section::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:var(--border);
}

.mm-quote-benefits{
  display:flex;
  flex-direction:column;
  gap:.75rem;
}

.mm-quote-benefits > div{
  display:flex;
  align-items:flex-start;
  gap:.85rem;
  padding:.9rem 0;
  border-bottom:1px solid var(--border);
}

.mm-quote-benefits > div:last-child{
  border-bottom:0;
}

.mm-quote-benefits > div > span{
  width:34px;
  height:34px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mm-quote-benefits p{
  font-size:.88rem;
  line-height:1.55;
}

.mm-quote-benefits strong{
  display:block;
  margin-bottom:.12rem;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.87rem;
}

.mm-quote-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  padding:clamp(1.25rem, 3vw, 2rem);
  color:var(--text);
}

.mm-quote-card-head{
  padding-bottom:1rem;
  margin-bottom:.35rem;
  border-bottom:1px solid var(--border);
}

.mm-quote-card-head > span{
  display:inline-block;
  margin-bottom:.35rem;
  color:var(--brand-red);
  font-family:var(--font-head);
  font-weight:800;
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.mm-quote-card-head h3{
  font-size:clamp(1.15rem, 2vw, 1.4rem);
}

.mm-quote-card-head p{
  margin-top:.3rem;
  font-size:.84rem;
}

.mm-quote-card .form-label{
  margin-bottom:.38rem;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.75rem;
  color:var(--charcoal);
  letter-spacing:.015em;
}

.mm-quote-card .form-control,
.mm-quote-card .form-select{
  min-height:48px;
  border-radius:10px;
  border:1.5px solid var(--border);
  padding:.72rem .88rem;
  font-size:.9rem;
  color:var(--text);
  background-color:#fff;
  transition:
    border-color .18s ease,
    box-shadow .18s ease;
}

.mm-quote-card textarea.form-control{
  min-height:98px;
  resize:vertical;
}

.mm-quote-card .form-control::placeholder{
  color:#A1A8B0;
}

.mm-quote-card .form-control:focus,
.mm-quote-card .form-select:focus{
  border-color:rgba(180,35,44,.65);
  box-shadow:0 0 0 4px rgba(180,35,44,.08);
}


/* ==========================================================================
   9. SERVICE CARDS
   ========================================================================== */

.mm-service-card{
  position:relative;
  overflow:hidden;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:1.75rem;
  height:100%;
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease;
}

.mm-service-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:4px;
  height:0;
  border-radius:0 0 4px 0;
  background:var(--brand-red);
  transition:height .22s ease;
}

.mm-service-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-md);
  border-color:rgba(180,35,44,.18);
}

.mm-service-card:hover::before{
  height:100%;
}

.mm-service-icon{
  width:52px;
  height:52px;
  border-radius:14px;
  background:var(--brand-red-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--brand-red);
  margin-bottom:1.15rem;
  transition:
    background-color .2s ease,
    color .2s ease,
    transform .2s ease;
}

.mm-service-card:hover .mm-service-icon{
  background:var(--brand-red);
  color:#fff;
  transform:rotate(-3deg);
}

.mm-service-card h3{
  font-size:1.08rem;
  margin-bottom:.55rem;
}

.mm-service-card p{
  font-size:.9rem;
  line-height:1.65;
}

.mm-service-link{
  display:inline-flex;
  align-items:center;
  gap:.38rem;
  margin-top:1.1rem;
  font-family:var(--font-head);
  font-weight:800;
  font-size:.82rem;
  color:var(--brand-red);
}

.mm-service-link svg{
  transition:transform .18s ease;
}

.mm-service-card:hover .mm-service-link{
  color:var(--brand-red-dark);
}

.mm-service-card:hover .mm-service-link svg{
  transform:translateX(3px);
}


/* ==========================================================================
   10. PROCESS
   ========================================================================== */

.mm-process-item{
  position:relative;
  padding:1.15rem 0;
}

.mm-process-num{
  width:42px;
  height:42px;
  margin-bottom:1rem;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-head);
  font-weight:800;
  font-size:.78rem;
  color:#fff;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
  box-shadow:0 10px 20px rgba(180,35,44,.16);
}

.mm-process-item h3,
.mm-process-item h4{
  font-size:1rem;
  margin-bottom:.35rem;
}

.mm-process-item p{
  font-size:.88rem;
  line-height:1.6;
}

.mm-process-line{
  display:none;
}

@media (min-width:992px){
  .mm-process-line{
    display:block;
    position:absolute;
    top:35px;
    left:58px;
    width:calc(100% - 22px);
    height:1px;
    background:
      repeating-linear-gradient(
        90deg,
        rgba(180,35,44,.25) 0 8px,
        transparent 8px 14px
      );
  }
}


/* ==========================================================================
   11. WHY MOVEPRO / IMAGE CONTENT
   ========================================================================== */

.mm-feature-row{
  display:flex;
  gap:1rem;
  align-items:flex-start;
  padding:1rem 0;
  border-bottom:1px solid var(--border);
}

.mm-feature-row:last-of-type{
  border-bottom:0;
}

.mm-feature-check{
  width:32px;
  height:32px;
  border-radius:10px;
  background:var(--brand-red-soft);
  color:var(--brand-red);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  margin-top:.1rem;
}

.mm-feature-row h3,
.mm-feature-row h4{
  font-size:.98rem;
  margin-bottom:.24rem;
}

.mm-feature-row p{
  font-size:.89rem;
}

.mm-photo-frame{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
}

.mm-photo-frame-movepro{
  aspect-ratio:4 / 3;
  background:var(--surface-soft);
}

.mm-photo-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.mm-photo-frame-movepro::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 50%, rgba(16,22,29,.68) 100%);
  pointer-events:none;
}

.mm-photo-caption{
  position:absolute;
  z-index:2;
  left:1.15rem;
  right:1.15rem;
  bottom:1.15rem;
  display:flex;
  flex-direction:column;
  gap:.2rem;
}

.mm-photo-caption span{
  color:#fff;
  font-family:var(--font-head);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.mm-photo-caption strong{
  max-width:420px;
  color:#fff;
  font-family:var(--font-head);
  font-size:1rem;
  font-weight:700;
  line-height:1.35;
}

.mm-inline-link{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  color:var(--brand-red);
  font-family:var(--font-head);
  font-weight:800;
  font-size:.86rem;
}

.mm-inline-link:hover{
  color:var(--brand-red-dark);
}

.mm-inline-link span{
  transition:transform .18s ease;
}

.mm-inline-link:hover span{
  transform:translateX(3px);
}


/* Legacy floating image badge retained for other pages */
.mm-badge-float{
  position:absolute;
  left:1.25rem;
  bottom:1.25rem;
  background:rgba(23,33,43,.92);
  backdrop-filter:blur(6px);
  color:#fff;
  border-radius:var(--radius-md);
  padding:1rem 1.25rem;
  display:flex;
  align-items:center;
  gap:.85rem;
}

.mm-badge-float .num{
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.6rem;
  color:#fff;
  line-height:1;
}

.mm-badge-float .lbl{
  font-size:.75rem;
  color:rgba(255,255,255,.75);
  max-width:110px;
}


/* ==========================================================================
   12. CITY / AREA CARDS
   ========================================================================== */

.mm-city-card{
  height:100%;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:1.35rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  transition:
    transform .2s ease,
    border-color .2s ease,
    background-color .2s ease,
    box-shadow .2s ease;
}

.mm-city-card:hover{
  transform:translateY(-3px);
  border-color:rgba(180,35,44,.28);
  background:#fff;
  box-shadow:var(--shadow-sm);
}

.mm-city-card h3{
  font-size:1rem;
  margin-bottom:.25rem;
}

.mm-city-card p{
  font-size:.8rem;
  line-height:1.5;
  margin:0;
}

.mm-city-arrow{
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--brand-red-soft);
  border:1px solid rgba(180,35,44,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--brand-red);
  flex-shrink:0;
  transition:
    transform .2s ease,
    background-color .2s ease,
    color .2s ease;
}

.mm-city-card:hover .mm-city-arrow{
  background:var(--brand-red);
  color:#fff;
  transform:translateX(3px);
}


/* ==========================================================================
   13. RESIDENTIAL / COMMERCIAL MOVING TYPE GRID
   ========================================================================== */

.mm-moving-types{
  background:#fff;
}

.mm-moving-type-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1rem;
}

.mm-moving-type-card{
  position:relative;
  min-height:205px;
  padding:1.4rem;
  background:var(--warm-bg);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.mm-moving-type-card:hover{
  transform:translateY(-3px);
  border-color:rgba(180,35,44,.22);
  box-shadow:var(--shadow-sm);
}

.mm-moving-type-card > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  margin-bottom:1.05rem;
  border-radius:11px;
  background:var(--brand-red-soft);
  color:var(--brand-red);
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
}

.mm-moving-type-card h3{
  font-size:1rem;
  margin-bottom:.45rem;
}

.mm-moving-type-card p{
  font-size:.85rem;
  line-height:1.6;
}


/* ==========================================================================
   14. TESTIMONIALS
   Retained for later when real MovePro reviews are available.
   ========================================================================== */

.mm-testimonial-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:1.75rem;
  height:100%;
}

.mm-stars{
  color:var(--brand-red);
  font-size:.85rem;
  letter-spacing:.15em;
  margin-bottom:.9rem;
}

.mm-testimonial-card p.quote{
  color:var(--text);
  font-size:.95rem;
  margin-bottom:1.25rem;
}

.mm-testimonial-person{
  display:flex;
  align-items:center;
  gap:.75rem;
}

.mm-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  background:var(--charcoal);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-head);
  font-weight:700;
  font-size:.85rem;
  flex-shrink:0;
}

.mm-testimonial-person .name{
  font-family:var(--font-head);
  font-weight:700;
  font-size:.88rem;
  color:var(--charcoal);
}

.mm-testimonial-person .role{
  font-size:.78rem;
  color:var(--text-2);
}


/* ==========================================================================
   15. FAQ
   ========================================================================== */

.mm-accordion .accordion-item{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm) !important;
  margin-bottom:.72rem;
  overflow:hidden;
  transition:border-color .18s ease;
}

.mm-accordion .accordion-item:has(.accordion-button:not(.collapsed)){
  border-color:rgba(180,35,44,.22);
}

.mm-accordion .accordion-button{
  font-family:var(--font-head);
  font-weight:700;
  font-size:.95rem;
  color:var(--charcoal);
  padding:1.1rem 1.2rem;
  background:var(--surface);
}

.mm-accordion .accordion-button:not(.collapsed){
  color:var(--brand-red);
  background:var(--brand-red-soft);
  box-shadow:none;
}

.mm-accordion .accordion-button:focus{
  box-shadow:none;
}

.mm-accordion .accordion-button::after{
  flex-shrink:0;
}

.mm-accordion .accordion-body{
  font-size:.9rem;
  color:var(--text-2);
  padding:1rem 1.2rem 1.25rem;
}


/* ==========================================================================
   16. FINAL CTA
   ========================================================================== */

.mm-cta-band{
  position:relative;
  overflow:hidden;
  padding:clamp(2rem, 5vw, 3.5rem);
  border-radius:var(--radius-lg);
  color:#fff;
  background:
    linear-gradient(135deg, var(--brand-red-dark) 0%, var(--brand-red) 55%, #C53942 100%);
  box-shadow:0 22px 50px rgba(134,25,35,.2);
}

.mm-cta-band::before{
  content:"";
  position:absolute;
  width:300px;
  height:300px;
  right:-100px;
  top:-140px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
}

.mm-cta-band::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:80px;
  bottom:-110px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  pointer-events:none;
}

.mm-cta-band h2{
  position:relative;
  z-index:2;
  color:#fff;
}

.mm-cta-band p{
  position:relative;
  z-index:2;
  color:rgba(255,255,255,.78);
}

.mm-cta-kicker{
  position:relative;
  z-index:2;
  display:block;
  margin-bottom:.55rem;
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}


/* ==========================================================================
   17. FOOTER
   ========================================================================== */

.mm-footer{
  background:var(--charcoal);
  color:rgba(255,255,255,.64);
  padding-block:clamp(3rem, 5vw, 4.5rem) 1.75rem;
}

.mm-footer h5{
  font-family:var(--font-head);
  color:#fff;
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  margin-bottom:1.1rem;
}

.mm-footer a{
  color:rgba(255,255,255,.66);
  font-size:.89rem;
  transition:color .15s ease;
}

.mm-footer a:hover{
  color:#fff;
}

.mm-footer ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.65rem;
}

.mm-footer-brand{
  display:flex;
  align-items:center;
  gap:.65rem;
  color:#fff;
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.1rem;
}

.mm-footer-bottom{
  margin-top:2.5rem;
  padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:.82rem;
}

.mm-social{
  width:38px;
  height:38px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  transition:
    background-color .15s ease,
    border-color .15s ease,
    transform .15s ease;
}

.mm-social:hover{
  background:var(--brand-red);
  border-color:var(--brand-red);
  color:#fff;
  transform:translateY(-2px);
}


/* ==========================================================================
   18. FLOATING ACTION BUTTONS
   ========================================================================== */

.mm-fab-stack{
  position:fixed;
  right:1.25rem;
  bottom:calc(1.25rem + env(safe-area-inset-bottom, 0px));
  z-index:1045;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.8rem;
  transition:bottom .2s ease;
}

.mm-fab{
  position:relative;
  width:56px;
  height:56px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:
    0 12px 26px rgba(23,33,43,.2),
    0 2px 6px rgba(23,33,43,.12);
  border:0;
  cursor:pointer;
  transition:
    transform .22s cubic-bezier(.34,1.56,.64,1),
    box-shadow .22s ease,
    background-color .2s ease;
  flex-shrink:0;
}

.mm-fab svg{
  width:25px;
  height:25px;
  display:block;
}

.mm-fab:hover{
  transform:translateY(-3px) scale(1.05);
  box-shadow:
    0 17px 32px rgba(23,33,43,.24),
    0 4px 10px rgba(23,33,43,.15);
  color:#fff;
}

.mm-fab:active{
  transform:translateY(-1px) scale(.96);
}

.mm-fab:focus-visible{
  outline:3px solid rgba(180,35,44,.24);
  outline-offset:3px;
}

.mm-fab-whatsapp{
  background:var(--whatsapp);
}

.mm-fab-whatsapp:hover{
  background:#20BF5A;
}

.mm-fab-call{
  background:var(--brand-red);
  color:#fff;
}

.mm-fab-call:hover{
  background:var(--brand-red-dark);
  color:#fff;
}

.mm-fab-call:focus-visible{
  outline-color:rgba(180,35,44,.3);
}

.mm-fab-tooltip{
  position:absolute;
  right:calc(100% + .75rem);
  top:50%;
  transform:translateY(-50%) translateX(4px);
  background:var(--charcoal);
  color:#fff;
  font-family:var(--font-head);
  font-weight:600;
  font-size:.78rem;
  white-space:nowrap;
  padding:.45rem .8rem;
  border-radius:8px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity .18s ease,
    transform .18s ease;
  box-shadow:var(--shadow-sm);
}

.mm-fab-tooltip::after{
  content:"";
  position:absolute;
  left:100%;
  top:50%;
  transform:translateY(-50%);
  border:5px solid transparent;
  border-left-color:var(--charcoal);
}

.mm-fab:hover .mm-fab-tooltip,
.mm-fab:focus-visible .mm-fab-tooltip{
  opacity:1;
  visibility:visible;
  transform:translateY(-50%) translateX(0);
}

.mm-fab-whatsapp::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:50%;
  background:var(--whatsapp);
  opacity:.5;
  animation:mm-fab-pulse 2.2s ease-out 3;
}

@keyframes mm-fab-pulse{
  0%{
    transform:scale(1);
    opacity:.45;
  }

  100%{
    transform:scale(1.7);
    opacity:0;
  }
}


/* ==========================================================================
   19. STICKY MOBILE CTA
   ========================================================================== */

.mm-mobile-cta{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:1030;
  background:rgba(255,255,255,.96);
  border-top:1px solid var(--border);
  padding:.7rem 1rem;
  box-shadow:0 -6px 20px rgba(23,33,43,.08);
  backdrop-filter:blur(12px);
}


/* ==========================================================================
   20. RESPONSIVE
   ========================================================================== */

@media (max-width:1199.98px){
  .h-display{
    font-size:clamp(2.35rem, 4.5vw, 3.65rem);
  }

  .mm-hero-slide{
    min-height:420px;
  }
}

@media (max-width:991.98px){
  .mm-hero-movepro{
    padding-block:3rem 3.75rem;
  }

  .mm-hero-visual{
    max-width:720px;
    margin:1rem auto 0;
    padding:0;
  }

  .mm-hero-shape{
    width:82%;
    height:90%;
    right:-1%;
    top:-2%;
  }

  .mm-hero-slide{
    height:clamp(400px, 70vw, 560px);
    min-height:400px;
  }

  .mm-hero-service-note{
    left:18px;
    bottom:-20px;
  }

  .mm-trust-item{
    justify-content:flex-start;
  }

  .mm-fab-stack{
    right:1rem;
    bottom:calc(88px + env(safe-area-inset-bottom, 0px));
    gap:.7rem;
  }
}

@media (max-width:767.98px){
  .section-pad{
    padding-block:3.75rem;
  }

  .section-pad-sm{
    padding-block:3rem;
  }

  .h-display{
    font-size:clamp(2.15rem, 10vw, 3rem);
    line-height:1.06;
  }

  .h-section{
    font-size:clamp(1.65rem, 7vw, 2.1rem);
  }

  .mm-hero-movepro{
    padding-top:2.5rem;
  }

  .mm-hero-points{
    gap:.65rem;
  }

  .mm-hero-points span{
    width:100%;
  }

  .mm-hero-slide{
    min-height:380px;
    height:118vw;
    max-height:500px;
  }

  .mm-slide-label{
    left:1rem;
    right:1rem;
    bottom:1rem;
  }

  .mm-moving-type-grid{
    grid-template-columns:1fr;
  }

  .mm-moving-type-card{
    min-height:auto;
  }
}

@media (max-width:575.98px){
  .container-xl-custom{
    padding-inline:1rem;
  }

  .mm-brand-mark{
    width:38px;
    height:38px;
    border-radius:11px;
  }

  .mm-brand-mark svg{
    width:20px;
    height:20px;
  }

  .mm-brand-name{
    font-size:1.02rem;
  }

  .mm-brand small{
    font-size:.56rem;
  }

  .mm-hero-badge{
    font-size:.68rem;
    padding:.46rem .72rem;
  }

  .mm-hero-movepro .lead-text{
    font-size:.96rem;
  }

  .mm-hero-movepro .btn{
    width:100%;
    justify-content:center;
  }

  .mm-hero-visual{
    margin-top:.5rem;
  }

  .mm-hero-shape{
    display:none;
  }

  .mm-hero-carousel{
    border-radius:20px;
  }

  .mm-hero-slide{
    height:112vw;
    min-height:340px;
    max-height:440px;
  }

  .mm-carousel-controls{
    top:.8rem;
    left:.8rem;
    right:.8rem;
  }

  .mm-carousel-arrows button{
    width:34px;
    height:34px;
  }

  .mm-hero-service-note{
    position:relative;
    left:auto;
    bottom:auto;
    width:calc(100% - 1.25rem);
    max-width:none;
    margin:-18px auto 0;
    border-radius:14px;
  }

  .mm-trust-item{
    align-items:flex-start;
    font-size:.74rem;
    line-height:1.35;
  }

  .mm-trust-item .icon{
    margin-top:.05rem;
  }

  .mm-quote-card{
    border-radius:20px;
    padding:1.15rem;
  }

  .mm-city-card{
    padding:1.15rem;
  }

  .mm-cta-band{
    border-radius:20px;
    padding:1.6rem;
  }

  .mm-fab{
    width:50px;
    height:50px;
  }

  .mm-fab svg{
    width:22px;
    height:22px;
  }
}

@media (min-width:992px){
  .mm-mobile-cta{
    display:none !important;
  }
}

@media (hover:none){
  .mm-fab-tooltip{
    display:none;
  }
}


/* ==========================================================================
   21. ACCESSIBILITY / REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }

  .mm-hero-carousel .carousel-item.active .mm-hero-slide img{
    transform:none;
  }
}


/* ==========================================================================
   22. ABOUT MOVEPRO UAE
   ========================================================================== */

.mp-about-hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(3.25rem, 6vw, 6.25rem);
  background:
    radial-gradient(circle at 8% 12%, rgba(180,35,44,.07), transparent 26%),
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
}

.mp-about-hero::after{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-260px;
  top:-190px;
  border-radius:50%;
  border:1px solid rgba(180,35,44,.08);
  pointer-events:none;
}

.mp-about-hero-copy{
  max-width:650px;
  color:var(--text-2);
  font-size:clamp(1rem, 1.4vw, 1.08rem);
  line-height:1.78;
}

.mp-about-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

.mp-about-tags span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:.42rem .72rem;
  border:1px solid var(--border);
  border-radius:100px;
  background:#fff;
  color:var(--charcoal-soft);
  font-size:.73rem;
  font-weight:700;
}

.mp-about-hero-visual{
  position:relative;
  max-width:610px;
  min-height:535px;
  margin-left:auto;
}

.mp-about-main-image{
  position:absolute;
  inset:0 42px 34px 0;
  overflow:hidden;
  border-radius:28px;
  background:var(--surface-soft);
  box-shadow:var(--shadow-lg);
}

.mp-about-main-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 60%, rgba(13,19,25,.25) 100%);
  pointer-events:none;
}

.mp-about-main-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.mp-about-small-image{
  position:absolute;
  right:0;
  bottom:0;
  width:43%;
  aspect-ratio:4 / 3;
  overflow:hidden;
  border:6px solid #fff;
  border-radius:20px;
  box-shadow:var(--shadow-md);
  background:var(--surface-soft);
  z-index:3;
}

.mp-about-small-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.mp-about-visual-card{
  position:absolute;
  z-index:4;
  left:-26px;
  bottom:35px;
  max-width:320px;
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.95rem 1rem;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow-md);
}

.mp-about-visual-icon{
  width:43px;
  height:43px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
}

.mp-about-visual-icon svg{
  width:21px;
  height:21px;
}

.mp-about-visual-card strong{
  display:block;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.8rem;
  line-height:1.25;
}

.mp-about-visual-card small{
  display:block;
  margin-top:.16rem;
  color:var(--text-2);
  font-size:.68rem;
}


/* Intro strip */

.mp-about-intro-strip{
  background:var(--charcoal);
}

.mp-about-intro-item{
  height:100%;
  display:flex;
  align-items:flex-start;
  gap:.85rem;
  padding:1.35rem 1.1rem;
}

.mp-about-intro-item > span{
  width:34px;
  height:34px;
  flex-shrink:0;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-family:var(--font-head);
  font-size:.7rem;
  font-weight:800;
}

.mp-about-intro-item strong{
  display:block;
  color:#fff;
  font-family:var(--font-head);
  font-size:.85rem;
}

.mp-about-intro-item p{
  margin-top:.12rem;
  color:rgba(255,255,255,.58);
  font-size:.76rem;
  line-height:1.45;
}

@media (min-width:768px){
  .mp-about-intro-item{
    border-right:1px solid rgba(255,255,255,.1);
  }

  .mp-about-intro-strip .col-md-4:last-child .mp-about-intro-item{
    border-right:0;
  }
}


/* Story image */

.mp-about-story-image{
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--surface-soft);
  box-shadow:var(--shadow-md);
}

.mp-about-story-image img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  min-height:500px;
  display:block;
  object-fit:cover;
}

.mp-about-story-accent{
  position:absolute;
  z-index:3;
  width:120px;
  height:120px;
  left:-34px;
  bottom:-34px;
  border-radius:30px;
  border:18px solid rgba(180,35,44,.82);
  transform:rotate(9deg);
}


/* Mission / Vision */

.mp-purpose-card{
  position:relative;
  height:100%;
  overflow:hidden;
  padding:clamp(1.5rem, 3vw, 2.25rem);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:var(--shadow-sm);
}

.mp-purpose-card .mp-purpose-number{
  position:absolute;
  right:1.5rem;
  top:1.1rem;
  color:rgba(180,35,44,.1);
  font-family:var(--font-head);
  font-size:4rem;
  font-weight:800;
  line-height:1;
  letter-spacing:-.08em;
}

.mp-purpose-card h2{
  position:relative;
  z-index:2;
  max-width:570px;
  font-size:clamp(1.35rem, 2.4vw, 1.85rem);
  line-height:1.22;
}

.mp-purpose-card p{
  position:relative;
  z-index:2;
  max-width:590px;
}

.mp-purpose-card-dark{
  background:var(--charcoal);
  border-color:var(--charcoal);
}

.mp-purpose-card-dark h2{
  color:#fff;
}

.mp-purpose-card-dark p{
  color:rgba(255,255,255,.64);
}

.mp-purpose-card-dark .eyebrow{
  color:#fff;
}

.mp-purpose-card-dark .eyebrow::before{
  background:var(--brand-red);
}

.mp-purpose-card-dark .mm-service-icon{
  color:#fff;
  background:rgba(255,255,255,.08);
}

.mp-purpose-card-dark .mp-purpose-number{
  color:rgba(255,255,255,.06);
}


/* About process */

.mp-about-process{
  background:var(--charcoal);
}

.mp-about-process .eyebrow{
  color:#fff;
}

.mp-about-process .eyebrow::before{
  background:var(--brand-red);
}

.mp-about-process .h-section{
  color:#fff;
}

.mp-about-process > .container-xl-custom > .row > .col-lg-4 > p{
  color:rgba(255,255,255,.58);
}

.mp-about-process-list{
  border-top:1px solid rgba(255,255,255,.11);
}

.mp-about-process-row{
  display:grid;
  grid-template-columns:56px minmax(0, 1fr);
  gap:1rem;
  padding:1.25rem 0;
  border-bottom:1px solid rgba(255,255,255,.11);
}

.mp-about-process-number{
  width:40px;
  height:40px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:var(--brand-red);
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
}

.mp-about-process-row h3{
  color:#fff;
  font-size:1rem;
  margin-bottom:.28rem;
}

.mp-about-process-row p{
  color:rgba(255,255,255,.58);
  font-size:.87rem;
}


/* Trust visual */

.mp-about-trust-visual{
  position:relative;
  min-height:570px;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--surface-soft);
  box-shadow:var(--shadow-md);
}

.mp-about-trust-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 52%, rgba(14,20,27,.7) 100%);
  pointer-events:none;
}

.mp-about-trust-visual img{
  width:100%;
  height:100%;
  min-height:570px;
  display:block;
  object-fit:cover;
}

.mp-about-trust-card{
  position:absolute;
  z-index:3;
  left:1.25rem;
  right:1.25rem;
  bottom:1.25rem;
  max-width:430px;
  padding:1.2rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:16px;
  background:rgba(23,33,43,.78);
  backdrop-filter:blur(12px);
}

.mp-about-trust-card > span{
  display:block;
  margin-bottom:.35rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.mp-about-trust-card strong{
  display:block;
  color:#fff;
  font-family:var(--font-head);
  font-size:1rem;
}

.mp-about-trust-card p{
  margin-top:.3rem;
  color:rgba(255,255,255,.65);
  font-size:.8rem;
}


/* Team role cards */

.mp-team-role-card{
  position:relative;
  overflow:hidden;
  padding:1.4rem;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.mp-team-role-card:hover{
  transform:translateY(-4px);
  border-color:rgba(180,35,44,.22);
  box-shadow:var(--shadow-sm);
}

.mp-team-role-card > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  margin-bottom:1rem;
  border-radius:11px;
  background:var(--brand-red-soft);
  color:var(--brand-red);
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
}

.mp-team-role-card h3{
  font-size:1rem;
  margin-bottom:.42rem;
}

.mp-team-role-card p{
  font-size:.84rem;
  line-height:1.6;
}


/* About responsive */

@media (max-width:991.98px){
  .mp-about-hero-visual{
    max-width:720px;
    min-height:540px;
    margin:1rem auto 0;
  }

  .mp-about-main-image{
    inset:0 48px 36px 0;
  }

  .mp-about-visual-card{
    left:18px;
  }

  .mp-about-story-image,
  .mp-about-story-image img{
    min-height:460px;
  }

  .mp-about-trust-visual,
  .mp-about-trust-visual img{
    min-height:500px;
  }
}

@media (max-width:767.98px){
  .mp-about-hero{
    padding-top:2.5rem;
  }

  .mp-about-hero-visual{
    min-height:470px;
  }

  .mp-about-main-image{
    inset:0 32px 42px 0;
    border-radius:22px;
  }

  .mp-about-small-image{
    width:46%;
    border-width:5px;
    border-radius:17px;
  }

  .mp-about-visual-card{
    left:12px;
    bottom:34px;
  }

  .mp-about-intro-item{
    padding-inline:0;
    border-bottom:1px solid rgba(255,255,255,.09);
  }

  .mp-about-intro-strip .col-12:last-child .mp-about-intro-item{
    border-bottom:0;
  }
}

@media (max-width:575.98px){
  .mp-about-tags span{
    font-size:.68rem;
  }

  .mp-about-hero-visual{
    min-height:430px;
  }

  .mp-about-main-image{
    inset:0 0 58px 0;
  }

  .mp-about-small-image{
    right:10px;
    bottom:8px;
    width:45%;
  }

  .mp-about-visual-card{
    left:10px;
    right:10px;
    bottom:0;
    max-width:68%;
    padding:.78rem;
  }

  .mp-about-visual-icon{
    width:38px;
    height:38px;
  }

  .mp-about-visual-card strong{
    font-size:.72rem;
  }

  .mp-about-visual-card small{
    display:none;
  }

  .mp-about-story-image,
  .mp-about-story-image img{
    min-height:380px;
  }

  .mp-about-trust-visual,
  .mp-about-trust-visual img{
    min-height:420px;
  }

  .mp-about-process-row{
    grid-template-columns:46px minmax(0, 1fr);
    gap:.75rem;
  }
}


/* ==========================================================================
   23. CONTACT MOVEPRO UAE
   ========================================================================== */

/* Breadcrumb */
.mp-contact-breadcrumb{
  padding-block:.78rem;
  background:#fff;
  border-bottom:1px solid var(--border);
}

.mp-contact-breadcrumb .breadcrumb{
  font-family:var(--font-head);
  font-size:.78rem;
  font-weight:700;
}

.mp-contact-breadcrumb .breadcrumb-item a{
  color:var(--charcoal);
}

.mp-contact-breadcrumb .breadcrumb-item a:hover{
  color:var(--brand-red);
}

.mp-contact-breadcrumb .breadcrumb-item.active{
  color:var(--text-2);
}


/* Contact hero */
.mp-contact-hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(3.25rem, 6vw, 6.25rem);
  background:
    radial-gradient(circle at 7% 10%, rgba(180,35,44,.07), transparent 27%),
    radial-gradient(circle at 94% 12%, rgba(180,35,44,.07), transparent 24%),
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
}

.mp-contact-hero::before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-210px;
  bottom:-210px;
  border-radius:50%;
  border:1px solid rgba(180,35,44,.09);
  pointer-events:none;
}

.mp-contact-hero-copy{
  max-width:650px;
  color:var(--text-2);
  font-size:clamp(1rem, 1.4vw, 1.08rem);
  line-height:1.78;
}

.mp-contact-hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem 1rem;
}

.mp-contact-hero-points span{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  color:var(--charcoal-soft);
  font-size:.8rem;
  font-weight:700;
}

.mp-contact-hero-points svg{
  width:18px;
  height:18px;
  padding:3px;
  border-radius:50%;
  background:var(--brand-red-soft);
  color:var(--brand-red);
}


/* Hero contact panel */
.mp-contact-hero-panel{
  position:relative;
  overflow:hidden;
  padding:clamp(1.4rem, 3vw, 2rem);
  border-radius:var(--radius-lg);
  background:var(--charcoal);
  box-shadow:var(--shadow-lg);
}

.mp-contact-hero-panel::after{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  right:-90px;
  top:-110px;
  border-radius:50%;
  background:rgba(180,35,44,.28);
  filter:blur(2px);
  pointer-events:none;
}

.mp-contact-hero-panel-top{
  position:relative;
  z-index:2;
  max-width:530px;
  padding-bottom:1.25rem;
  margin-bottom:1.1rem;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.mp-contact-panel-kicker{
  display:block;
  margin-bottom:.5rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.mp-contact-hero-panel h2{
  color:#fff;
  font-size:clamp(1.45rem, 2.8vw, 2rem);
  line-height:1.18;
}

.mp-contact-hero-panel p{
  margin-top:.65rem;
  color:rgba(255,255,255,.62);
  font-size:.88rem;
}

.mp-contact-panel-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.8rem;
}

.mp-contact-panel-action{
  min-height:92px;
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.9rem;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  background:rgba(255,255,255,.055);
  transition:
    transform .18s ease,
    background-color .18s ease,
    border-color .18s ease;
}

.mp-contact-panel-action:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.18);
}

.mp-contact-panel-action-primary{
  background:var(--brand-red);
  border-color:var(--brand-red);
}

.mp-contact-panel-action-primary:hover{
  background:var(--brand-red-dark);
  border-color:var(--brand-red-dark);
}

.mp-contact-panel-icon{
  width:42px;
  height:42px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:rgba(255,255,255,.1);
}

.mp-contact-panel-icon svg{
  width:21px;
  height:21px;
}

.mp-contact-panel-action small{
  display:block;
  color:rgba(255,255,255,.52);
  font-size:.66rem;
}

.mp-contact-panel-action strong{
  display:block;
  margin-top:.08rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.78rem;
  font-weight:800;
  line-height:1.25;
}


/* Contact method cards */
.mp-contact-method-card{
  display:flex;
  flex-direction:column;
  padding:1.5rem;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.mp-contact-method-card:hover{
  transform:translateY(-4px);
  border-color:rgba(180,35,44,.22);
  box-shadow:var(--shadow-sm);
}

.mp-contact-method-card h3{
  font-size:1rem;
  margin-bottom:.4rem;
}

.mp-contact-method-card p{
  margin-bottom:1rem;
  font-size:.84rem;
  line-height:1.6;
}


/* Contact quote section */
.mp-contact-quote-section{
  position:relative;
  background:#fff;
}

.mp-contact-form-tips{
  display:flex;
  flex-direction:column;
}

.mp-contact-form-tips > div{
  display:flex;
  align-items:flex-start;
  gap:.85rem;
  padding:1rem 0;
  border-bottom:1px solid var(--border);
}

.mp-contact-form-tips > div:last-child{
  border-bottom:0;
}

.mp-contact-form-tips > div > span{
  width:34px;
  height:34px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  color:var(--brand-red);
  background:var(--brand-red-soft);
  font-family:var(--font-head);
  font-size:.7rem;
  font-weight:800;
}

.mp-contact-form-tips p{
  font-size:.87rem;
  line-height:1.55;
}

.mp-contact-form-tips strong{
  display:block;
  margin-bottom:.12rem;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.86rem;
}

.mp-contact-form-card{
  box-shadow:var(--shadow-lg);
}


/* Location section */
.mp-contact-location-section{
  background:var(--surface-soft);
  border-block:1px solid var(--border);
}

.mp-contact-location-card{
  position:relative;
  overflow:hidden;
  padding:clamp(1.6rem, 4vw, 2.75rem);
  border-radius:var(--radius-lg);
  background:#fff;
  border:1px solid var(--border);
}

.mp-contact-location-card::after{
  content:"";
  position:absolute;
  width:250px;
  height:250px;
  right:-100px;
  top:-120px;
  border-radius:50%;
  background:var(--brand-red-soft);
  pointer-events:none;
}

.mp-contact-location-card p{
  max-width:720px;
}

.mp-contact-location-visual{
  position:relative;
  z-index:2;
  min-height:130px;
  display:flex;
  align-items:center;
  gap:1rem;
  padding:1.2rem;
  border-radius:18px;
  color:#fff;
  background:
    linear-gradient(135deg, var(--brand-red-dark), var(--brand-red));
  box-shadow:var(--shadow-red);
}

.mp-location-pin{
  width:50px;
  height:50px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:rgba(255,255,255,.12);
}

.mp-location-pin svg{
  width:25px;
  height:25px;
}

.mp-contact-location-visual small{
  display:block;
  color:rgba(255,255,255,.66);
  font-size:.7rem;
}

.mp-contact-location-visual strong{
  display:block;
  margin-top:.12rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.92rem;
}


/* Responsive */
@media (max-width:991.98px){
  .mp-contact-hero-panel{
    max-width:720px;
    margin-inline:auto;
  }
}

@media (max-width:767.98px){
  .mp-contact-hero{
    padding-top:2.5rem;
  }

  .mp-contact-hero-points span{
    width:100%;
  }

  .mp-contact-panel-grid{
    grid-template-columns:1fr;
  }

  .mp-contact-panel-action{
    min-height:82px;
  }
}

@media (max-width:575.98px){
  .mp-contact-hero-panel{
    border-radius:20px;
    padding:1.15rem;
  }

  .mp-contact-method-card{
    padding:1.25rem;
  }

  .mp-contact-location-card{
    border-radius:20px;
    padding:1.35rem;
  }
}


/* ==========================================================================
   24. MOVEPRO UAE — AREA LANDING PAGES
   ========================================================================== */

.mp-area-breadcrumb{
  padding-block:.78rem;
  background:#fff;
  border-bottom:1px solid var(--border);
}

.mp-area-breadcrumb .breadcrumb{
  font-family:var(--font-head);
  font-size:.78rem;
  font-weight:700;
}

.mp-area-breadcrumb .breadcrumb-item a{
  color:var(--charcoal);
}

.mp-area-breadcrumb .breadcrumb-item a:hover{
  color:var(--brand-red);
}

.mp-area-breadcrumb .breadcrumb-item.active{
  color:var(--text-2);
}


/* Hero */
.mp-area-hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(3.25rem, 6vw, 6.25rem);
  background:
    radial-gradient(circle at 7% 8%, rgba(180,35,44,.07), transparent 27%),
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
}

.mp-area-hero::after{
  content:"";
  position:absolute;
  width:380px;
  height:380px;
  right:-235px;
  top:-170px;
  border-radius:50%;
  border:1px solid rgba(180,35,44,.08);
  pointer-events:none;
}

.mp-area-hero-copy{
  max-width:650px;
  color:var(--text-2);
  font-size:clamp(1rem, 1.4vw, 1.08rem);
  line-height:1.78;
}

.mp-area-hero-services{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

.mp-area-hero-services span{
  display:inline-flex;
  align-items:center;
  padding:.42rem .72rem;
  border:1px solid var(--border);
  border-radius:100px;
  background:#fff;
  color:var(--charcoal-soft);
  font-size:.71rem;
  font-weight:700;
}

.mp-area-hero-visual{
  position:relative;
  max-width:620px;
  margin-left:auto;
  padding:0 0 1.5rem 1.25rem;
}

.mp-area-hero-visual::before{
  content:"";
  position:absolute;
  width:78%;
  height:88%;
  right:-2%;
  top:-4%;
  border-radius:30px;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
  transform:rotate(3.5deg);
}

.mp-area-hero-image{
  position:relative;
  z-index:2;
  min-height:500px;
  overflow:hidden;
  border-radius:26px;
  background:var(--surface-soft);
  box-shadow:var(--shadow-lg);
}

.mp-area-hero-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(13,19,25,.24) 100%);
  pointer-events:none;
}

.mp-area-hero-image img{
  width:100%;
  height:100%;
  min-height:500px;
  display:block;
  object-fit:cover;
}

.mp-area-city-label{
  position:absolute;
  z-index:4;
  left:0;
  bottom:0;
  display:flex;
  align-items:center;
  gap:.75rem;
  min-width:235px;
  padding:.9rem 1rem;
  border:1px solid var(--border);
  border-radius:15px;
  background:#fff;
  box-shadow:var(--shadow-md);
}

.mp-area-city-pin{
  width:40px;
  height:40px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:var(--brand-red);
}

.mp-area-city-pin svg{
  width:20px;
  height:20px;
}

.mp-area-city-label small{
  display:block;
  color:var(--text-2);
  font-size:.65rem;
}

.mp-area-city-label strong{
  display:block;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.82rem;
}


/* Contact strip */
.mp-area-contact-strip{
  background:var(--charcoal);
}

.mp-area-contact-item{
  height:100%;
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:1.2rem;
  color:#fff;
  transition:background-color .18s ease;
}

.mp-area-contact-item:hover{
  background:rgba(255,255,255,.05);
  color:#fff;
}

.mp-area-contact-icon{
  width:38px;
  height:38px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  color:#fff;
  background:var(--brand-red);
}

.mp-area-contact-icon svg{
  width:19px;
  height:19px;
}

.mp-area-contact-item small{
  display:block;
  color:rgba(255,255,255,.52);
  font-size:.65rem;
}

.mp-area-contact-item strong{
  display:block;
  margin-top:.1rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.78rem;
}

@media (min-width:768px){
  .mp-area-contact-strip .col-md-4:not(:last-child) .mp-area-contact-item{
    border-right:1px solid rgba(255,255,255,.1);
  }
}


/* About */
.mp-area-about-image{
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--surface-soft);
  box-shadow:var(--shadow-md);
}

.mp-area-about-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 58%, rgba(15,21,28,.62) 100%);
  pointer-events:none;
}

.mp-area-about-image img{
  width:100%;
  height:100%;
  min-height:500px;
  display:block;
  object-fit:cover;
}

.mp-area-about-image-label{
  position:absolute;
  z-index:3;
  left:1.2rem;
  bottom:1.2rem;
}

.mp-area-about-image-label span{
  display:block;
  color:rgba(255,255,255,.68);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.mp-area-about-image-label strong{
  display:block;
  margin-top:.18rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:1rem;
}


/* Communities */
.mp-community-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.75rem;
}

.mp-community-item{
  min-height:64px;
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.85rem;
  border:1px solid var(--border);
  border-radius:13px;
  background:#fff;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.8rem;
  font-weight:700;
}

.mp-community-pin{
  width:30px;
  height:30px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mp-community-pin svg{
  width:16px;
  height:16px;
}


/* Area service cards */
.mp-area-service-card{
  height:100%;
  min-height:105px;
  display:grid;
  grid-template-columns:42px minmax(0, 1fr) 38px;
  align-items:center;
  gap:.8rem;
  padding:1.1rem;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.mp-area-service-card:hover{
  transform:translateY(-3px);
  border-color:rgba(180,35,44,.24);
  box-shadow:var(--shadow-sm);
}

.mp-area-service-number{
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:var(--brand-red);
  background:var(--brand-red-soft);
  font-family:var(--font-head);
  font-size:.7rem;
  font-weight:800;
}

.mp-area-service-card h3{
  font-size:.94rem;
  margin-bottom:.18rem;
}

.mp-area-service-card p{
  font-size:.75rem;
}


/* Benefits */
.mp-area-benefits-section{
  color:#fff;
  background:var(--charcoal);
}

.mp-area-benefits-section .eyebrow{
  color:#fff;
}

.mp-area-benefits-section .eyebrow::before{
  background:var(--brand-red);
}

.mp-area-benefits-section .h-section{
  color:#fff;
}

.mp-area-benefits-section .col-lg-4 > p{
  color:rgba(255,255,255,.58);
}

.mp-area-benefit-card{
  padding:1.25rem;
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.045);
}

.mp-area-benefit-check{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:.9rem;
  border-radius:10px;
  color:#fff;
  background:var(--brand-red);
}

.mp-area-benefit-check svg{
  width:16px;
  height:16px;
}

.mp-area-benefit-card h3{
  color:#fff;
  font-size:.94rem;
  margin-bottom:.35rem;
}

.mp-area-benefit-card p{
  color:rgba(255,255,255,.58);
  font-size:.82rem;
}


/* Gallery */
.mp-area-gallery{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.8rem;
}

.mp-area-gallery-item{
  position:relative;
  aspect-ratio:1 / 1;
  overflow:hidden;
  margin:0;
  border-radius:16px;
  background:var(--surface);
}

.mp-area-gallery-item img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .35s ease;
}

.mp-area-gallery-item:hover img{
  transform:scale(1.045);
}


/* Map */
.mp-area-map-section{
  background:#fff;
}

.mp-area-map{
  overflow:hidden;
  aspect-ratio:16 / 7;
  min-height:340px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
}

.mp-area-map iframe{
  width:100%;
  height:100%;
  min-height:340px;
  display:block;
}


/* Final CTA actions */
.mp-area-final-actions{
  position:relative;
  z-index:3;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.55rem;
}

.mp-area-final-email{
  position:relative;
  z-index:3;
  display:block;
  margin-top:.7rem;
  text-align:right;
  color:rgba(255,255,255,.72);
  font-size:.75rem;
  font-weight:600;
}

.mp-area-final-email:hover{
  color:#fff;
}


/* Responsive */
@media (max-width:991.98px){
  .mp-area-hero-visual{
    max-width:720px;
    margin:1rem auto 0;
  }

  .mp-community-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .mp-area-gallery{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .mp-area-final-actions{
    justify-content:flex-start;
  }

  .mp-area-final-email{
    text-align:left;
  }
}

@media (max-width:767.98px){
  .mp-area-hero{
    padding-top:2.5rem;
  }

  .mp-area-hero-visual{
    padding-left:0;
  }

  .mp-area-hero-visual::before{
    width:86%;
    right:-1%;
  }

  .mp-area-hero-image,
  .mp-area-hero-image img{
    min-height:420px;
  }

  .mp-area-contact-item{
    border-bottom:1px solid rgba(255,255,255,.09);
  }

  .mp-area-contact-strip .col-12:last-child .mp-area-contact-item{
    border-bottom:0;
  }

  .mp-community-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .mp-area-about-image,
  .mp-area-about-image img{
    min-height:420px;
  }

  .mp-area-map{
    aspect-ratio:4 / 3;
  }
}

@media (max-width:575.98px){
  .mp-area-hero-visual::before{
    display:none;
  }

  .mp-area-hero-image{
    border-radius:20px;
  }

  .mp-area-city-label{
    left:10px;
    bottom:0;
    min-width:210px;
  }

  .mp-area-hero-image,
  .mp-area-hero-image img{
    min-height:360px;
  }

  .mp-community-grid{
    grid-template-columns:1fr;
  }

  .mp-community-item{
    min-height:58px;
  }

  .mp-area-service-card{
    grid-template-columns:38px minmax(0, 1fr) 36px;
    min-height:96px;
    padding:.95rem;
  }

  .mp-area-about-image,
  .mp-area-about-image img{
    min-height:360px;
  }

  .mp-area-gallery{
    gap:.55rem;
  }

  .mp-area-gallery-item{
    border-radius:12px;
  }

  .mp-area-map{
    min-height:300px;
    border-radius:20px;
  }

  .mp-area-final-actions{
    flex-direction:column;
  }

  .mp-area-final-actions .btn{
    width:100%;
    text-align:center;
  }
}


/* ==========================================================================
   25. MOVEPRO UAE — SERVICE LANDING PAGES
   ========================================================================== */

.mp-service-breadcrumb{
  padding-block:.78rem;
  background:#fff;
  border-bottom:1px solid var(--border);
}

.mp-service-breadcrumb .breadcrumb{
  font-family:var(--font-head);
  font-size:.78rem;
  font-weight:700;
}

.mp-service-breadcrumb .breadcrumb-item a{
  color:var(--charcoal);
}

.mp-service-breadcrumb .breadcrumb-item a:hover{
  color:var(--brand-red);
}

.mp-service-breadcrumb .breadcrumb-item.active{
  color:var(--text-2);
}


/* Service hero */
.mp-service-hero{
  position:relative;
  overflow:hidden;
  padding-block:clamp(3.25rem, 6vw, 6.25rem);
  background:
    radial-gradient(circle at 7% 8%, rgba(180,35,44,.07), transparent 27%),
    linear-gradient(180deg, #fff 0%, var(--warm-bg) 100%);
}

.mp-service-hero::after{
  content:"";
  position:absolute;
  width:390px;
  height:390px;
  right:-240px;
  top:-175px;
  border-radius:50%;
  border:1px solid rgba(180,35,44,.08);
  pointer-events:none;
}

.mp-service-hero-copy{
  max-width:650px;
  color:var(--text-2);
  font-size:clamp(1rem, 1.4vw, 1.08rem);
  line-height:1.78;
}

.mp-service-hero-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

.mp-service-hero-tags span{
  display:inline-flex;
  align-items:center;
  padding:.42rem .72rem;
  border:1px solid var(--border);
  border-radius:100px;
  background:#fff;
  color:var(--charcoal-soft);
  font-size:.71rem;
  font-weight:700;
}

.mp-service-hero-visual{
  position:relative;
  max-width:620px;
  margin-left:auto;
  padding:0 0 1.5rem 1.25rem;
}

.mp-service-hero-visual::before{
  content:"";
  position:absolute;
  width:78%;
  height:88%;
  right:-2%;
  top:-4%;
  border-radius:30px;
  background:linear-gradient(145deg, var(--brand-red), var(--brand-red-dark));
  transform:rotate(3.5deg);
}

.mp-service-hero-image{
  position:relative;
  z-index:2;
  min-height:500px;
  overflow:hidden;
  border-radius:26px;
  background:var(--surface-soft);
  box-shadow:var(--shadow-lg);
}

.mp-service-hero-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 58%, rgba(13,19,25,.26) 100%);
  pointer-events:none;
}

.mp-service-hero-image img{
  width:100%;
  height:100%;
  min-height:500px;
  display:block;
  object-fit:cover;
}

.mp-service-floating-card{
  position:absolute;
  z-index:4;
  left:0;
  bottom:0;
  min-width:245px;
  max-width:330px;
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.9rem 1rem;
  border:1px solid var(--border);
  border-radius:15px;
  background:#fff;
  box-shadow:var(--shadow-md);
}

.mp-service-floating-icon{
  width:40px;
  height:40px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:#fff;
  background:var(--brand-red);
}

.mp-service-floating-icon svg{
  width:20px;
  height:20px;
}

.mp-service-floating-card small{
  display:block;
  color:var(--text-2);
  font-size:.65rem;
}

.mp-service-floating-card strong{
  display:block;
  margin-top:.1rem;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.78rem;
  line-height:1.25;
}


/* Service contact strip */
.mp-service-contact-strip{
  background:var(--charcoal);
}

.mp-service-contact-item{
  height:100%;
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:1.2rem;
  color:#fff;
  transition:background-color .18s ease;
}

.mp-service-contact-item:hover{
  background:rgba(255,255,255,.05);
  color:#fff;
}

.mp-service-contact-icon{
  width:38px;
  height:38px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  color:#fff;
  background:var(--brand-red);
}

.mp-service-contact-icon svg{
  width:19px;
  height:19px;
}

.mp-service-contact-item small{
  display:block;
  color:rgba(255,255,255,.52);
  font-size:.65rem;
}

.mp-service-contact-item strong{
  display:block;
  margin-top:.1rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:.78rem;
}

@media (min-width:768px){
  .mp-service-contact-strip .col-md-4:not(:last-child) .mp-service-contact-item{
    border-right:1px solid rgba(255,255,255,.1);
  }
}


/* Overview image */
.mp-service-overview-image{
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--surface-soft);
  box-shadow:var(--shadow-md);
}

.mp-service-overview-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 58%, rgba(15,21,28,.62) 100%);
  pointer-events:none;
}

.mp-service-overview-image img{
  width:100%;
  height:100%;
  min-height:500px;
  display:block;
  object-fit:cover;
}

.mp-service-overview-label{
  position:absolute;
  z-index:3;
  left:1.2rem;
  bottom:1.2rem;
}

.mp-service-overview-label span{
  display:block;
  color:rgba(255,255,255,.68);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.mp-service-overview-label strong{
  display:block;
  margin-top:.18rem;
  color:#fff;
  font-family:var(--font-head);
  font-size:1rem;
}


/* Included */
.mp-service-included-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:.8rem;
}

.mp-service-included-item{
  min-height:72px;
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.9rem 1rem;
  border:1px solid var(--border);
  border-radius:13px;
  background:#fff;
  color:var(--charcoal);
  font-family:var(--font-head);
  font-size:.78rem;
  font-weight:700;
}

.mp-service-included-check{
  width:30px;
  height:30px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  color:var(--brand-red);
  background:var(--brand-red-soft);
}

.mp-service-included-check svg{
  width:15px;
  height:15px;
}


/* Benefits */
.mp-service-benefits{
  color:#fff;
  background:var(--charcoal);
}

.mp-service-benefits .eyebrow{
  color:#fff;
}

.mp-service-benefits .eyebrow::before{
  background:var(--brand-red);
}

.mp-service-benefits .h-section{
  color:#fff;
}

.mp-service-benefits .col-lg-4 > p{
  color:rgba(255,255,255,.58);
}

.mp-service-benefit-card{
  padding:1.25rem;
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.045);
}

.mp-service-benefit-check{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:.9rem;
  border-radius:10px;
  color:#fff;
  background:var(--brand-red);
}

.mp-service-benefit-check svg{
  width:16px;
  height:16px;
}

.mp-service-benefit-card h3{
  color:#fff;
  font-size:.94rem;
  margin-bottom:.35rem;
}

.mp-service-benefit-card p{
  color:rgba(255,255,255,.58);
  font-size:.82rem;
}


/* Gallery */
.mp-service-gallery{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.8rem;
}

.mp-service-gallery-item{
  position:relative;
  aspect-ratio:1 / 1;
  overflow:hidden;
  margin:0;
  border-radius:16px;
  background:#fff;
}

.mp-service-gallery-item img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .35s ease;
}

.mp-service-gallery-item:hover img{
  transform:scale(1.045);
}


/* Final CTA */
.mp-service-final-actions{
  position:relative;
  z-index:3;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.55rem;
}

.mp-service-final-email{
  position:relative;
  z-index:3;
  display:block;
  margin-top:.7rem;
  text-align:right;
  color:rgba(255,255,255,.72);
  font-size:.75rem;
  font-weight:600;
}

.mp-service-final-email:hover{
  color:#fff;
}


/* Responsive */
@media (max-width:991.98px){
  .mp-service-hero-visual{
    max-width:720px;
    margin:1rem auto 0;
  }

  .mp-service-included-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .mp-service-gallery{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .mp-service-final-actions{
    justify-content:flex-start;
  }

  .mp-service-final-email{
    text-align:left;
  }
}

@media (max-width:767.98px){
  .mp-service-hero{
    padding-top:2.5rem;
  }

  .mp-service-hero-visual{
    padding-left:0;
  }

  .mp-service-hero-visual::before{
    width:86%;
    right:-1%;
  }

  .mp-service-hero-image,
  .mp-service-hero-image img{
    min-height:420px;
  }

  .mp-service-contact-item{
    border-bottom:1px solid rgba(255,255,255,.09);
  }

  .mp-service-contact-strip .col-12:last-child .mp-service-contact-item{
    border-bottom:0;
  }

  .mp-service-overview-image,
  .mp-service-overview-image img{
    min-height:420px;
  }
}

@media (max-width:575.98px){
  .mp-service-hero-visual::before{
    display:none;
  }

  .mp-service-hero-image{
    border-radius:20px;
  }

  .mp-service-hero-image,
  .mp-service-hero-image img{
    min-height:360px;
  }

  .mp-service-floating-card{
    left:10px;
    bottom:0;
    min-width:210px;
    max-width:calc(100% - 20px);
  }

  .mp-service-included-grid{
    grid-template-columns:1fr;
  }

  .mp-service-included-item{
    min-height:64px;
  }

  .mp-service-overview-image,
  .mp-service-overview-image img{
    min-height:360px;
  }

  .mp-service-gallery{
    gap:.55rem;
  }

  .mp-service-gallery-item{
    border-radius:12px;
  }

  .mp-service-final-actions{
    flex-direction:column;
  }

  .mp-service-final-actions .btn{
    width:100%;
    text-align:center;
  }
}
.mm-footer-description {
    max-width: 340px;
    color: rgba(255,255,255,.62);
    font-size: .88rem;
    line-height: 1.7;
}

.mm-footer-contact-text {
    color: rgba(255,255,255,.62);
    font-size: .88rem;
}