/* ===== MADAR polish pack ===== */

/* Palette */
:root{
  --madar-green:#0acd7f;
  --madar-green-600:#0abd76;
  --madar-green-700:#08a968;
  --madar-dark:#013334;
  --madar-alt:#083b3c;            /* section alt surface */
  --madar-white:#f9ffff;
  --madar-ink:#01241f;
}

/* Global surface */
body,.b.eh{background:var(--madar-dark);color:var(--madar-white);}

/* Navbar active/hover */
.xl:hover,.xl.mk{color:var(--madar-green)!important;}

/* Accent labels/headings */
.kk,.ek.yj,.mk{color:var(--madar-green)!important;}

/* Alt section backgrounds (by id or unique class) */
#about,
#packages,
#support,
.hj.rp.hr,            /* testimonials */
.pj.vp.mr,            /* clients */
.i.pg.qh.rm.ji.hp{    /* counters+map */
  background:var(--madar-alt);
}

/* Subtle cards on dark */
.hh\/20,.hh\/10,.nl,.il{
  background-color:rgba(10,205,127,.08)!important;
  border-color:rgba(249,255,255,.08)!important;
}

/* ----- Primary buttons (filled) ----- */
.vc,.lk,._l,.jk,.dk,
a.vc,button.vc{
  background:var(--madar-green)!important;
  background-image:none!important;
  border:1.5px solid var(--madar-green)!important;
  color:var(--madar-ink)!important;
}
.vc:hover,.rg:hover,.lk:hover,._l:hover,.jk:hover,.dk:hover{
  background:var(--madar-green-600)!important;
  border-color:var(--madar-green-600)!important;
}
/* .rg{
  background-color: var(--madar-white) !important;
} */
.vc:active,.rg:active,.lk:active,._l:active,.jk:active,.dk:active{
  background:var(--madar-green-700)!important;
  border-color:var(--madar-green-700)!important;
}

/* Pricing outline vs filled pairs */
.gh.sl{ /* filled */
  background:var(--madar-green)!important;border:1.5px solid var(--madar-green)!important;color:var(--madar-ink)!important;
}
.gh.sl:hover{background:var(--madar-green-600)!important;border-color:var(--madar-green-600)!important;}

.mh.tl{ /* outline */
  background:transparent!important;border:1.5px solid var(--madar-green)!important;color:var(--madar-green)!important;
}
.mh.tl:hover{background:var(--madar-green)!important;color:var(--madar-ink)!important;}

/* Pricing toggle track & knob */
.i.rg.gm{background:rgba(10,205,127,.32)!important;border-color:rgba(10,205,127,.5)!important;}
.i.rg.gm .h.vc{background:var(--madar-green)!important}

/* Link color inside dark cards (readability) */
a{color:#a7efcf;}
a:hover{color:var(--madar-green);}

/* Inputs on dark */
input.vd,textarea.vd,.vd.ph{
  background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:var(--madar-white)!important;
}
input.vd::placeholder,textarea.vd::placeholder{color:#bcd7d2!important;}

/* Focus ring brand */
:root{--tw-ring-color:rgba(10,205,127,.5)!important;}
a:focus-visible,button:focus-visible,input:focus,textarea:focus{
  outline:none!important;box-shadow:0 0 0 3px var(--tw-ring-color)!important;
}

/* Swiper arrows (testimonials) */
.swiper-button-prev,.swiper-button-next{
  background:rgba(10,205,127,.14)!important;border:1px solid rgba(10,205,127,.35)!important;
}
.swiper-button-prev:hover,.swiper-button-next:hover{
  background:var(--madar-green)!important;color:var(--madar-ink)!important;
}

/* Back-to-top fab */
button._a{background:var(--madar-green)!important;color:var(--madar-ink)!important;border-color:var(--madar-green)!important;}
button._a:hover{background:var(--madar-green-600)!important;border-color:var(--madar-green-600)!important;}

/* CTA background (keeps brand gradient) */
.madar-cta{
  background:
    radial-gradient(900px 480px at 85% 12%, rgba(10,205,127,.18), transparent 60%),
    radial-gradient(800px 420px at 10% 110%, rgba(10,205,127,.12), transparent 60%),
    var(--madar-dark);
}
.madar-cta .shape{opacity:.14;filter:hue-rotate(140deg) saturate(60%);}
.madar-cta .cta-card{background:transparent;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 60px rgba(0,0,0,.25);}
/* Hide Alpine until ready */
[x-cloak]{display:none!important}

/* WhatsApp button – fixed style */
.madar-whatsapp{
  display:inline-flex; align-items:center; gap:.55rem;
  background:var(--madar-green); color:#01241f;
  font-weight:700; padding:.65rem 1rem .65rem .8rem;
  border-radius:9999px; border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(10,205,127,.25); transition:.18s ease;
}
.madar-whatsapp:hover{ transform:translateY(-1px); background:#10e08d }

/* Toast popup */
.madar-toast{
  position:fixed; left:50%; top:20px; transform:translateX(-50%);
  z-index:9999; display:flex; align-items:center; gap:.6rem;
  padding:.75rem 1rem; border-radius:9999px;
  background:rgba(1,51,52,.96);
  border:1px solid rgba(10,205,127,.6);
  color:var(--madar-white); box-shadow:0 14px 40px rgba(0,0,0,.35);
  max-width:95vw; white-space:normal;
}
.madar-toast{ top:auto; bottom:20px; right:20px; left:auto; transform:none; }

/* Hero image follows the page direction */
#hero .hero-visual{
  position:absolute;          /* keep your original layout */
  top:0; bottom:0;
  transition:left .25s,right .25s,transform .25s;
}

/* Arabic = RTL -> image on the LEFT */
[dir="rtl"] #hero .hero-visual{
  left:0 !important;
  right:auto !important;
  transform-origin:left center;
}

/* English = LTR -> image on the RIGHT */
[dir="ltr"] #hero .hero-visual{
  right:0 !important;
  left:auto !important;
  transform-origin:right center;
}

/* Mobile: let it stack naturally */
@media (max-width:1024px){
  #hero .hero-visual{
    position:static !important;
    width:100%;
    left:auto !important; right:auto !important;
  }
}

/* Arabic content alignment */
[dir="rtl"] body{
  direction: rtl;
}

[dir="rtl"] #hero .animate_left,
[dir="rtl"] #features .kn,
[dir="rtl"] .animate_right.jn\/2,
[dir="rtl"] #about .animate_top.bb.ze.rj.ki.xn.vq,
[dir="rtl"] #about .sg,
[dir="rtl"] #packages .animate_top.bb.ze.rj.ki.xn.vq,
[dir="rtl"] #packages article,
[dir="rtl"] #stats-map .bb.ze.i.va.ki.xn.br,
[dir="rtl"] #support .animate_top.bb.ze.rj.ki.xn.vq,
[dir="rtl"] #support .fb,
[dir="rtl"] #support form,
[dir="rtl"] .footer-credit{
  text-align:right;
}

[dir="rtl"] #hero .tc.tf.yo.zf.mb,
[dir="rtl"] #packages .tc.wf.xf.jb.og,
[dir="rtl"] #support .tc.uf.sn.tf.rn.un.zf,
[dir="rtl"] #support .tc.sf.yo.ap.zf.ep.qb,
[dir="rtl"] footer .tc.wf.gg{
  flex-direction:row-reverse;
}

[dir="rtl"] #packages del{
  margin-right:0 !important;
  margin-left:15px !important;
}

[dir="rtl"] #support input:not([type="email"]):not([type="tel"]),
[dir="rtl"] #support textarea{
  direction:rtl;
  text-align:right;
}

[dir="rtl"] #support input[type="email"],
[dir="rtl"] #support input[type="tel"]{
  direction:ltr;
  text-align:left;
}

/* Real map section */
.madar-map-intro{
  margin-bottom:24px;
  text-align:center;
}

.madar-map-kicker{
  display:inline-flex;
  align-items:center;
  padding:.5rem .95rem;
  border-radius:999px;
  background:rgba(10,205,127,.12);
  border:1px solid rgba(10,205,127,.22);
  color:var(--madar-green);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.madar-map-heading{
  margin:1rem 0 0;
  color:var(--madar-white);
  font-size:clamp(2rem, 3.4vw, 3rem);
  line-height:1.08;
}

.madar-map-copy{
  margin:.85rem auto 0;
  max-width:760px;
  color:#c8e2db;
  font-size:1.02rem;
  line-height:1.8;
}

.madar-map-stats-row{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:16px;
  margin-bottom:20px;
}

.madar-map-stat-card{
  padding:22px 24px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)),
    rgba(1,51,52,.72);
  box-shadow:0 18px 44px rgba(0,0,0,.16);
  text-align:center;
}

.madar-map-stat-label{
  display:block;
  color:#a7d5cb;
  font-size:.94rem;
  font-weight:600;
}

.madar-map-stat-value{
  display:block;
  margin:.8rem 0 .65rem;
  color:var(--madar-green);
  font-size:clamp(2.6rem, 4vw, 4rem);
  line-height:1;
  font-weight:800;
}

.madar-map-stat-note{
  margin:0;
  color:#d6ece7;
  font-size:.92rem;
  line-height:1.7;
}

.madar-map-card{
  padding:18px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(10,205,127,.14), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow:0 22px 56px rgba(0,0,0,.2);
}

.madar-map-toolbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.madar-map-toolbar-title{
  margin:0;
  color:var(--madar-white);
  font-size:1.3rem;
}

.madar-map-toolbar-copy{
  margin:.45rem 0 0;
  color:#bfdcd4;
  line-height:1.7;
}

.madar-real-map{
  width:100%;
  height:520px;
  min-height:520px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
}

.madar-map-fallback{
  display:grid;
  place-items:center;
  gap:.65rem;
  width:100%;
  height:100%;
  min-height:520px;
  padding:2rem;
  text-align:center;
  color:#d6ece7;
  background:
    radial-gradient(circle at center, rgba(10,205,127,.12), transparent 46%),
    rgba(1,51,52,.82);
}

.madar-map-fallback strong{
  color:var(--madar-white);
  font-size:1.05rem;
}

.madar-map-fallback span{
  max-width:520px;
  line-height:1.8;
}

[dir="rtl"] .madar-map-intro,
[dir="rtl"] .madar-map-card,
[dir="rtl"] .madar-map-stat-card{
  text-align:right;
}

@media (max-width:1100px){
  .madar-map-stats-row{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:768px){
  .madar-map-stats-row{
    grid-template-columns:1fr;
  }

  .madar-map-intro{
    text-align:start;
  }

  .madar-map-card{
    padding:14px;
  }

  .madar-real-map,
  .madar-map-fallback{
    height:420px;
    min-height:420px;
  }
}

/* Network dashboard */
.madar-network-shell{
  position:relative;
  padding:32px;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(10,205,127,.14), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow:0 28px 80px rgba(0,0,0,.22);
  overflow:hidden;
}

.madar-network-shell::before{
  content:"";
  position:absolute;
  inset:auto -120px -120px auto;
  width:280px;
  height:280px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(10,205,127,.18), transparent 72%);
  pointer-events:none;
}

.madar-network-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:24px;
}

.madar-network-kicker{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.5rem .9rem;
  border-radius:999px;
  background:rgba(10,205,127,.12);
  border:1px solid rgba(10,205,127,.2);
  color:var(--madar-green);
  font-size:.86rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.madar-network-title{
  margin:.9rem 0 0;
  color:var(--madar-white);
  font-size:clamp(2rem, 4vw, 3.35rem);
  line-height:1.06;
}

.madar-network-copy{
  margin:.95rem 0 0;
  max-width:760px;
  color:#c9e4de;
  font-size:1.04rem;
  line-height:1.8;
}

.madar-network-pill{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  padding:.85rem 1.1rem;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  color:var(--madar-white);
  font-weight:700;
  white-space:nowrap;
}

.madar-network-grid{
  display:grid;
  grid-template-columns:minmax(280px, 320px) minmax(0, 1fr);
  gap:24px;
  align-items:stretch;
}

.madar-network-stats{
  display:grid;
  gap:16px;
}

.madar-stat-card{
  position:relative;
  padding:22px 24px;
  min-height:148px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(1,51,52,.72);
  box-shadow:0 18px 44px rgba(0,0,0,.16);
  overflow:hidden;
}

.madar-stat-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(10,205,127,.3), transparent 70%);
}

.madar-stat-label{
  display:block;
  margin-bottom:.85rem;
  color:#a9d6cd;
  font-size:.94rem;
  font-weight:600;
}

.madar-stat-value{
  display:block;
  margin-bottom:.8rem;
  color:var(--madar-green);
  font-size:clamp(2.8rem, 4vw, 4.2rem);
  line-height:.95;
  font-weight:800;
}

.madar-stat-note{
  margin:0;
  color:#d9efe9;
  font-size:.95rem;
  line-height:1.75;
}

.madar-network-panel{
  display:flex;
  flex-direction:column;
  gap:18px;
  padding:22px;
  min-width:0;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(1,51,52,.78);
  box-shadow:0 18px 52px rgba(0,0,0,.18);
}

.madar-network-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.madar-network-panel-title{
  margin:0;
  color:var(--madar-white);
  font-size:1.35rem;
  line-height:1.3;
}

.madar-network-panel-note{
  margin:.55rem 0 0;
  color:#bddbd4;
  line-height:1.7;
}

.madar-network-status{
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  padding:.7rem .95rem;
  border-radius:999px;
  background:rgba(10,205,127,.1);
  border:1px solid rgba(10,205,127,.22);
  color:var(--madar-white);
  font-size:.92rem;
  font-weight:700;
  white-space:nowrap;
}

.madar-network-status-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--madar-green);
  box-shadow:0 0 0 8px rgba(10,205,127,.16);
}

.madar-live-map-wrap{
  position:relative;
  min-height:560px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(10,205,127,.16), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}

.madar-live-map{
  width:100%;
  height:560px;
  min-height:560px;
}

.madar-live-map > .madar-map-shell{
  height:100%;
  min-height:100%;
  border-radius:0;
}

.madar-map-legend{
  position:absolute;
  right:20px;
  bottom:20px;
  z-index:450;
  width:min(100%, 290px);
  padding:18px 20px;
  border-radius:20px;
  background:rgba(1,51,52,.84);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
  box-shadow:0 20px 46px rgba(0,0,0,.24);
}

.madar-map-legend h4{
  margin:0 0 .55rem;
  color:var(--madar-white);
  font-size:1rem;
}

.madar-map-legend p{
  margin:0;
  color:#d4ebe6;
  line-height:1.7;
}

.madar-map-legend-list{
  margin:1rem 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.7rem;
}

.madar-map-legend-list li{
  display:flex;
  align-items:center;
  gap:.75rem;
  color:#e1f3ee;
  font-size:.93rem;
}

.madar-map-legend-dot,
.madar-map-legend-ring{
  flex:0 0 auto;
  width:14px;
  height:14px;
  border-radius:50%;
}

.madar-map-legend-dot{
  background:var(--madar-green);
  border:2px solid rgba(1,51,52,.95);
}

.madar-map-legend-ring{
  border:2px solid rgba(10,205,127,.9);
  box-shadow:0 0 0 5px rgba(10,205,127,.16);
}

.madar-map-loading{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  min-height:560px;
  padding:2rem;
  color:#d4ebe6;
  font-size:1rem;
  text-align:center;
  background:
    radial-gradient(circle at center, rgba(10,205,127,.12), transparent 44%),
    rgba(1,51,52,.82);
}

.leaflet-container{
  background:#072f31;
  font:inherit;
}

.leaflet-bar{
  border:0 !important;
  box-shadow:none !important;
}

.leaflet-control-zoom{
  border:0 !important;
  box-shadow:0 18px 44px rgba(0,0,0,.22) !important;
}

.leaflet-control-zoom a{
  width:42px !important;
  height:42px !important;
  line-height:42px !important;
  background:rgba(1,51,52,.92) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:var(--madar-white) !important;
}

.leaflet-control-zoom a:hover{
  background:rgba(10,205,127,.18) !important;
  color:var(--madar-white) !important;
}

.leaflet-control-attribution{
  background:rgba(1,51,52,.86) !important;
  color:#cde8e2 !important;
  border-radius:12px 0 0 0;
  padding:5px 10px !important;
}

.leaflet-control-attribution a{
  color:#9ef0cb !important;
}

.leaflet-popup-content-wrapper{
  background:rgba(1,51,52,.96) !important;
  border:1px solid rgba(10,205,127,.24);
  border-radius:18px !important;
  box-shadow:0 18px 44px rgba(0,0,0,.25);
}

.leaflet-popup-tip{
  background:rgba(1,51,52,.96) !important;
}

.leaflet-popup-content{
  margin:14px 16px !important;
}

.madar-leaflet-popup{
  min-width:140px;
  text-align:center;
}

.madar-leaflet-popup strong{
  display:block;
  margin-bottom:.25rem;
  color:var(--madar-white);
  font-size:1rem;
}

.madar-leaflet-popup span{
  color:#bcded6;
  font-size:.9rem;
}

[dir="rtl"] .madar-network-head,
[dir="rtl"] .madar-network-panel-head,
[dir="rtl"] .madar-stat-card,
[dir="rtl"] .madar-map-legend{
  text-align:right;
}

[dir="rtl"] .madar-network-panel-head{
  flex-direction:row-reverse;
}

[dir="rtl"] .madar-map-legend{
  right:auto;
  left:20px;
}

[dir="rtl"] .madar-map-legend-list li{
  flex-direction:row-reverse;
}

[dir="rtl"] .madar-leaflet-popup{
  text-align:right;
}

@media (max-width:1100px){
  .madar-network-grid{
    grid-template-columns:1fr;
  }

  .madar-network-stats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:768px){
  .madar-network-shell{
    padding:22px;
  }

  .madar-network-head,
  .madar-network-panel-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .madar-network-stats{
    grid-template-columns:1fr;
  }

  .madar-live-map-wrap,
  .madar-live-map,
  .madar-map-loading{
    min-height:420px;
    height:420px;
  }

  .madar-map-legend{
    left:14px;
    right:14px;
    bottom:14px;
    width:auto;
  }

  [dir="rtl"] .madar-map-legend{
    left:14px;
  }
}

/* Built-in Saudi coverage map */
.madar-map-shell{
  position:relative;
  height:100%;
  min-height:420px;
  overflow:hidden;
  border-radius:18px;
  background:
    radial-gradient(circle at top right, rgba(10,205,127,.14), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
}

.madar-map-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:42px 42px;
  opacity:.35;
}

.madar-map-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.madar-map-land{
  fill:rgba(255,255,255,.08);
  stroke:rgba(255,255,255,.16);
  stroke-width:6;
}

.madar-map-land-secondary{
  fill:none;
  stroke:rgba(10,205,127,.22);
  stroke-width:4;
  stroke-linecap:round;
  stroke-dasharray:10 12;
}

.madar-map-points{
  position:absolute;
  inset:0;
}

.madar-map-point{
  position:absolute;
  transform:translate(-50%, -50%);
  border:0 !important;
  background:transparent !important;
  padding:0;
  cursor:pointer;
}

.madar-map-point::before{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:50%;
  background:rgba(10,205,127,.14);
  animation:madar-map-pulse 2.4s ease-out infinite;
}

.madar-map-dot{
  position:relative;
  display:block;
  width:14px;
  height:14px;
  border-radius:50%;
  background:var(--madar-green);
  border:2px solid rgba(1,51,52,.92);
  box-shadow:0 0 0 6px rgba(10,205,127,.18);
}

.madar-map-tooltip{
  position:absolute;
  left:50%;
  bottom:28px;
  min-width:132px;
  padding:.7rem .85rem;
  border-radius:14px;
  background:rgba(1,51,52,.96);
  border:1px solid rgba(10,205,127,.35);
  color:var(--madar-white);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
  transform:translate(-50%, 8px);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
  text-align:center;
}

.madar-map-tooltip strong{
  display:block;
  margin-bottom:.15rem;
  color:var(--madar-white);
}

.madar-map-tooltip span{
  color:#b9ddd2;
  font-size:.88rem;
}

.madar-map-point:hover .madar-map-tooltip,
.madar-map-point:focus-visible .madar-map-tooltip{
  opacity:1;
  transform:translate(-50%, 0);
}

.madar-map-summary{
  position:absolute;
  left:20px;
  bottom:20px;
  max-width:260px;
  padding:.8rem 1rem;
  border-radius:14px;
  background:rgba(1,51,52,.82);
  border:1px solid rgba(255,255,255,.08);
  color:#d5eeea;
  font-size:.92rem;
  line-height:1.6;
}

[dir="rtl"] .madar-map-summary{
  left:auto;
  right:20px;
  text-align:right;
}

[dir="rtl"] .madar-map-tooltip{
  text-align:center;
}

@keyframes madar-map-pulse{
  0%{
    transform:scale(.4);
    opacity:.6;
  }
  70%{
    transform:scale(1.15);
    opacity:0;
  }
  100%{
    transform:scale(1.15);
    opacity:0;
  }
}

@media (max-width:768px){
  .madar-map-shell{
    min-height:340px;
  }

  .madar-map-summary{
    left:14px;
    right:14px;
    bottom:14px;
    max-width:none;
  }

  [dir="rtl"] .madar-map-summary{
    right:14px;
  }

  .madar-map-tooltip{
    min-width:110px;
    padding:.6rem .7rem;
  }
}