
/* Malaz Front Deluxe UI (v1.19.12) */
:root{
  --mss-text:#0b1220;
  --mss-muted:#64748b;
  --mss-soft:rgba(15,23,42,.06);
  --mss-soft2:rgba(15,23,42,.10);

  --mss-radius-xl:28px;
  --mss-radius-lg:24px;
  --mss-radius-md:18px;

  --mss-shadow-1:0 14px 40px rgba(2,6,23,.10);
  --mss-shadow-2:0 26px 80px rgba(2,6,23,.14);
  --mss-shadow-3:0 40px 120px rgba(2,6,23,.18);

  --mss-h-font:"Alexandria", system-ui, -apple-system, Segoe UI, Arial;
  --mss-b-font:"Tajawal", system-ui, -apple-system, Segoe UI, Arial;
  --mss-alt-font:"Almarai", system-ui, -apple-system, Segoe UI, Arial;
}

/* ===================== Services ===================== */
.mss-section.mss-services{
  position:relative;
  overflow:hidden;
  direction:rtl;
  padding: clamp(24px, 3vw, 56px) 0;
  font-family: var(--mss-b-font);
  color: var(--mss-text);
  background: radial-gradient(circle at 15% 10%, rgba(37,99,235,.08), rgba(255,255,255,0) 46%),
              radial-gradient(circle at 90% 80%, rgba(255,255,255,0), rgba(255,255,255,0) 44%);
}

.mss-section.mss-services .mss-container{
  width:min(var(--mss-container, 1200px), 92%);
  margin:0 auto;
  position:relative;
  z-index:2;
}

.mss-section.mss-services .mss-head{
  text-align:center;
  margin-bottom: 22px;
}

.mss-section.mss-services .mss-title{
  font-family: var(--mss-h-font);
  font-weight:900;
  margin:0 0 8px;
  font-size: var(--mss-title-size, 34px);
  letter-spacing:.2px;
}

.mss-section.mss-services .mss-subtitle{
  margin:0 auto;
  max-width: 820px;
  color: var(--mss-muted);
  font-size: clamp(14px, 1.2vw, 18px);
  line-height: 1.95;
  font-weight: 700;
}

/* Background blobs (top-right + bottom-left) */
.mss-section.mss-services .mss-bg{
  pointer-events:none;
  position:absolute;
  width:min(620px, 60vw);
  height:min(620px, 60vw);
  z-index:1;
  background-repeat:no-repeat;
  background-size:contain;
  filter: drop-shadow(0 40px 120px rgba(2,6,23,.10));
  will-change: transform, opacity;
  opacity: var(--mss-bg-opacity, .14) !important;
}

.mss-section.mss-services .mss-bg1{
  top:-110px;
  right:-150px;
  background-image: var(--mss-bg1-image);
  opacity: var(--mss-bg1-opacity, .14) !important;
}
.mss-section.mss-services .mss-bg2{
  bottom:-120px;
  left:-160px;
  background-image: var(--mss-bg2-image);
  opacity: var(--mss-bg2-opacity, .14) !important;
}

.mss-section.mss-services .mss-grid{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(var(--mss-cols-d, 4), minmax(0,1fr));
  gap: 18px;
}
@media (max-width:1100px){
  .mss-section.mss-services .mss-grid{grid-template-columns: repeat(var(--mss-cols-t, 2), minmax(0,1fr));}
}
@media (max-width:640px){
  .mss-section.mss-services .mss-grid{grid-template-columns: repeat(var(--mss-cols-m, 1), minmax(0,1fr));}
}

/* Card */
.mss-section.mss-services .mss-card{
  position:relative;
  background: linear-gradient(180deg, #ffffff, #fbfbfd);
  border:1px solid var(--mss-soft);
  border-radius: var(--mss-radius-xl);
  box-shadow: var(--mss-shadow-1);
  overflow:hidden;
  transform: translateZ(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  min-height: 100%;
}

.mss-section.mss-services .mss-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--mss-shadow-2);
  border-color: rgba(37,99,235,.22);
}

/* Gloss + shine (restore) */
.mss-section.mss-services.mss-shine-on .mss-card:before{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.92), rgba(255,255,255,0) 48%);
  transform: translateX(-30%) translateY(-12%) rotate(25deg);
  opacity:0;
  transition: opacity .22s ease;
  pointer-events:none;
}
.mss-section.mss-services.mss-shine-on .mss-card:hover:before{opacity:.62;}

.mss-section.mss-services.mss-shine-on .mss-card:after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(255,255,255,0) 40%, rgba(255,255,255,0) 70%);
  opacity:0;
  transition: opacity .22s ease;
  pointer-events:none;
}
.mss-section.mss-services.mss-shine-on .mss-card:hover:after{opacity:.55;}

/* Media */
.mss-section.mss-services .mss-media{
  display:block;
  position:relative;
  aspect-ratio:16/9;
  background:#eef2f7;
  overflow:hidden;
}

.mss-section.mss-services .mss-media:after{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background: linear-gradient(105deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 65%);
  transform: translateX(-35%) rotate(12deg);
  opacity:0;
  transition: opacity .22s ease, transform .45s ease;
  pointer-events:none;
}
.mss-section.mss-services .mss-card:hover .mss-media:after{
  opacity:.9;
  transform: translateX(25%) rotate(12deg);
}
.mss-section.mss-services .mss-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity: var(--mss-img-opacity, 1) !important;
  transform: scale(1.02);
  transition: transform .32s ease;
}
.mss-section.mss-services .mss-card:hover .mss-media img{transform: scale(1.09);}

/* Badge image */
.mss-section.mss-services .mss-badge{
  position:absolute;
  top:12px;
  right:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:18px;
  background: rgba(11,18,32,.72);
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 55px rgba(2,6,23,.22);
  backdrop-filter: blur(8px);
}
.mss-section.mss-services .mss-badge img{width:42px;height:42px;object-fit:contain;display:block}

/* Body */
.mss-section.mss-services .mss-body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:0}
.mss-section.mss-services .mss-card-title{font-family: var(--mss-card-font, var(--mss-b-font)); font-size: var(--mss-card-title-size, 19px);
  margin: 6px 0 8px;
  font-family: var(--mss-h-font);
  font-weight: 900;
  font-size: 19px;
}
.mss-section.mss-services .mss-card-desc{font-family: var(--mss-card-font, var(--mss-b-font)); font-size: var(--mss-card-desc-size, 16px);
  margin:0 0 14px;
  color: var(--mss-muted);
  font-weight: 700;
  line-height: 1.9;
  min-height: 54px;
}

/* Actions */
.mss-section.mss-services .mss-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:auto;
}
.mss-section.mss-services .mss-btn{font-family: var(--mss-card-font, var(--mss-b-font));
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  border:1px solid var(--mss-soft2);
  background:#fff;
  color: var(--mss-text);
  text-decoration:none;
  font-weight: 900;
  box-shadow:0 16px 44px rgba(2,6,23,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.mss-section.mss-services .mss-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 26px 80px rgba(2,6,23,.16);
  border-color: rgba(37,99,235,.28);
}
.mss-section.mss-services .mss-btn-ico{
  width:36px;height:36px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background: rgba(11,18,32,.06);
  border:1px solid rgba(15,23,42,.08);
}
.mss-section.mss-services .mss-btn-ico svg{width:18px;height:18px;display:block}

.mss-section.mss-services .mss-btn-details{
  background: linear-gradient(180deg, rgba(37,99,235,.16), rgba(37,99,235,.07));
  border-color: rgba(37,99,235,.28);
}
.mss-section.mss-services .mss-btn-details .mss-btn-ico{
  background: rgba(37,99,235,.16);
  border-color: rgba(37,99,235,.22);
}
.mss-section.mss-services .mss-btn-wa{
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,0));
  border-color: rgba(255,255,255,0);
}
.mss-section.mss-services .mss-btn-wa .mss-btn-ico{
  background: rgba(255,255,255,0);
  border-color: rgba(255,255,255,0);
}

.mss-empty{
  grid-column: 1 / -1;
  background:#fff;
  border:1px dashed rgba(15,23,42,.22);
  border-radius: var(--mss-radius-xl);
  padding: 18px;
  text-align:center;
  color: var(--mss-muted);
  font-weight:900;
}

/* ===================== About (من نحن) ===================== */
.mss-about{
  position:relative;
  direction:rtl;
  padding: clamp(22px, 3vw, 56px) 0;
  font-family: var(--mss-b-font);
  background: var(--mss-about-bg, #ffffff);
  overflow:hidden;
}

.mss-about:before{
  content:"";
  position:absolute;
  inset:-20% -20%;
  background: radial-gradient(circle at 90% 70%, rgba(37,99,235,.08), rgba(255,255,255,0) 44%);
  pointer-events:none;
}

.mss-about .mss-about-inner{
  width:min(var(--mss-about-container, 1200px), 92%);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 24px;
  align-items:center;
  position:relative;
  z-index:1;
}

.mss-about .mss-about-inner.is-reverse{grid-template-columns: .9fr 1.1fr;}
@media (max-width:980px){
  .mss-about .mss-about-inner,
  .mss-about .mss-about-inner.is-reverse{grid-template-columns:1fr; gap:14px;}
}

.mss-about .mss-about-text{
  /* Remove the white card background behind "من نحن" content (as requested) */
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  padding: clamp(18px, 2.4vw, 26px);
}

.mss-about .mss-about-badge{
  display:inline-flex;
  padding:10px 16px;
  border-radius:999px;
  font-weight:900;
  font-family: var(--mss-alt-font);
  background: var(--mss-about-badge-bg, #dfeee2);
  color: var(--mss-about-badge-color, #0f6a2d);
  border:1px solid rgba(15,23,42,.08);
}

.mss-about .mss-about-title{
  margin: 12px 0 10px;
  font-family: var(--mss-h-font);
  font-weight: 900;
  color: var(--mss-about-title-color, #0b1220);
  font-size: var(--mss-about-title-size, 46px);
  line-height: 1.25;
}

.mss-about .mss-about-desc{
  margin: 0 0 10px;
  color: var(--mss-about-text-color, #44536b);
  font-weight: 700;
  line-height: 2;
  font-size: var(--mss-about-desc-size, 18px);
}

.mss-about .mss-about-points{
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  display:grid;
  gap: 10px;
}
.mss-about .mss-about-points li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:#475569;
  font-weight: 900;
}
.mss-about .mss-about-points li:before{
  content:"✓";
  width:26px;height:26px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background: rgba(255,255,255,0);
  border:1px solid rgba(255,255,255,0);
  color:#0b6b4e;
  flex:0 0 26px;
  margin-top:2px;
}

.mss-about .mss-about-cta{
  margin-top: 16px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 12px 18px;
  border-radius: 999px;
  text-decoration:none;
  background: var(--mss-about-btn-bg, #0f6a2d);
  color: var(--mss-about-btn-color, #fff);
  font-weight: 900;
  box-shadow: var(--mss-shadow-2);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.mss-about .mss-about-cta:hover{
  transform: translateY(-2px);
  box-shadow: var(--mss-shadow-3);
  filter: brightness(1.05);
}
.mss-about .mss-about-cta-ico{
  width:36px;height:36px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.24);
}

.mss-about .mss-about-media{display:flex;justify-content:center;align-items:center;}
.mss-about .mss-about-circle{
  position:relative;
  width: var(--mss-about-img, 420px);
  aspect-ratio:1/1;
  border-radius: 999px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: var(--mss-shadow-2);
  background:#eef2f7;
  transform: translateZ(0);
}
.mss-about .mss-about-circle img{
  width:100%;height:100%;object-fit:cover;
  transform: scale(1.02);
  transition: transform .32s ease;
}
.mss-about .mss-about-circle:hover img{transform: scale(1.08);}
.mss-about .mss-about-circle:after{
  content:"";
  position:absolute; inset:-30%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.82), rgba(255,255,255,0) 44%);
  opacity:0;
  transition: opacity .22s ease;
  pointer-events:none;
}
.mss-about .mss-about-circle:hover:after{opacity:.62;}

@media (prefers-reduced-motion: reduce){
  .mss-section.mss-services *, .mss-about *{transition:none !important; animation:none !important;}
}


/* Timeline / Circles Section (v1.19.12) */
.mss-timeline{
  direction:rtl;
  padding:64px 0;
  position:relative;
  overflow:hidden;
  background: var(--mss-tl-bg-custom,
    radial-gradient(circle at 18% 20%, rgba(34,197,94,.08), rgba(255,255,255,0) 46%),
    radial-gradient(circle at 84% 72%, rgba(37,99,235,.06), rgba(255,255,255,0) 52%)
  );
}
.mss-timeline:before{
  content:"";
  position:absolute; inset:-220px -160px;
  background: radial-gradient(circle at 30% 30%, rgba(2,6,23,.05), rgba(255,255,255,0) 55%);
  pointer-events:none;
  opacity:.9;
}
.mss-timeline .mss-container{max-width:1200px;margin:0 auto;padding:0 18px;position:relative;z-index:2}
.mss-timeline .mss-head{text-align:center}
.mss-timeline .mss-title{font-family:var(--mss-h-font);font-weight:900;font-size:var(--mss-tl-title,34px);margin:0;color:#0f172a;letter-spacing:-.02em}
.mss-timeline .mss-subtitle{font-family:var(--mss-b-font);font-weight:700;font-size:var(--mss-tl-sub,16px);margin:10px auto 0;max-width:760px;color:#64748b;line-height:1.9}

.mss-timeline .mss-tl{margin-top:26px;position:relative}
.mss-timeline .mss-tl-items{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;position:relative;padding:10px 6px;direction:ltr}
.mss-timeline .mss-tl-line{
  position:absolute;left:0;right:0;
  top:calc(var(--mss-tl-circle,86px)/2 + 10px);
  height:var(--mss-tl-bar,10px);
  border-radius:999px;
  background:linear-gradient(90deg, rgba(15,23,42,.12), rgba(15,23,42,.06));
  overflow:hidden;
  filter:drop-shadow(0 14px 34px rgba(2,6,23,.08));
}
.mss-timeline .mss-tl-line:before{
  content:"";
  position:absolute;top:0;bottom:0;
  left:calc(var(--mss-tl-start,0) * 100%);
  right:calc((1 - var(--mss-tl-end,1)) * 100%);
  background:linear-gradient(90deg, var(--mss-tl-from,#16a34a), var(--mss-tl-to,#22c55e));
  border-radius:inherit;
  transform: scaleX(0);
  /* Reveal from right → left */
  transform-origin: var(--mss-tl-origin, right) center;
  will-change: transform;
}
/* Subtle flowing highlight on the active bar (runs only when in view) */
.mss-timeline.is-inview .mss-tl-line:before{
  background-size: 200% 100%;
  animation:
    mss-bar-reveal 1.25s cubic-bezier(.22,1,.36,1) forwards,
    mss-bar-flow var(--mss-tl-dur,6s) var(--mss-tl-ease,linear) infinite;
  animation-delay: 0s, 1.25s;
  box-shadow: 0 0 var(--mss-tl-glow,18px) rgba(34,197,94,.35);
}
@keyframes mss-bar-reveal{
  from{transform: scaleX(0)}
  to{transform: scaleX(1)}
}
@keyframes mss-bar-flow{
  0%{background-position: 0% 50%}
  100%{background-position: 100% 50%}
}


.mss-timeline .mss-tl-item{flex:1;min-width:0;text-align:center;position:relative}
.mss-timeline .mss-tl-dot{
  width:var(--mss-tl-circle,86px);height:var(--mss-tl-circle,86px);
  margin:0 auto;
  border-radius:999px;
  background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.95), rgba(255,255,255,.6) 60%, rgba(255,255,255,.35));
  border:1px solid rgba(15,23,42,.08);
  box-shadow: 0 18px calc(var(--mss-tl-shadow,18) * 3px) rgba(2,6,23,.12);
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  transform:translateZ(0);
}
.mss-timeline .mss-tl-dot img{width:58%;height:58%;object-fit:contain;display:block;filter:none}
.mss-timeline .mss-tl-dot:after{
  content:"";position:absolute;inset:-60%;
  background:linear-gradient(105deg, rgba(255,255,255,0) 40%, rgba(255,255,255,.65) 50%, rgba(255,255,255,0) 60%);
  transform:translateX(calc(-30% * var(--mss-tl-sign, 1))) rotate(18deg);
  opacity:.0;pointer-events:none;
}
.mss-timeline.is-inview .mss-tl-dot:after{animation:mss-dot-shine var(--mss-tl-dur,6s) linear infinite;animation-delay:calc((var(--i,0)/var(--mss-tl-n,4))*var(--mss-tl-dur,6s));opacity:1}

@keyframes mss-dot-shine{
  0%,8%{opacity:0;transform:translateX(calc(-40% * var(--mss-tl-sign, 1))) rotate(18deg)}
  12%,22%{opacity:1;transform:translateX(calc(40% * var(--mss-tl-sign, 1))) rotate(18deg)}
  30%,100%{opacity:0;transform:translateX(calc(40% * var(--mss-tl-sign, 1))) rotate(18deg)}
}

.mss-timeline .mss-tl-dot:before{
  content:"";position:absolute;inset:-10px;border-radius:999px;
  background:radial-gradient(circle, rgba(34,197,94,.32), rgba(34,197,94,0) 60%);
  opacity:0;filter:blur(2px);
}
.mss-timeline.is-inview .mss-tl-dot:before{
  animation:mss-dot-glow var(--mss-tl-dur,6s) ease-in-out infinite;
  animation-delay:calc((var(--i,0)/var(--mss-tl-n,4))*var(--mss-tl-dur,6s));
}

@keyframes mss-dot-glow{
  0%,10%{opacity:0}
  14%,26%{opacity:1;filter:blur(0px)}
  34%,100%{opacity:0}
}

.mss-timeline .mss-tl-label{
  margin-top:12px;
  font-family:var(--mss-b-font);
  font-weight:900;
  font-size:var(--mss-tl-item,16px);
  color:#0f172a;
  line-height:1.5;
}

@media (max-width: 768px){
  .mss-timeline{padding:48px 0}
  .mss-timeline .mss-tl-line{display:none}
  .mss-timeline .mss-tl-items{flex-direction:column;gap:16px}
  .mss-timeline .mss-tl-item{display:flex;align-items:center;gap:12px;text-align:var(--mss-faq-text-align,right);direction:var(--mss-faq-dir,rtl)}
  .mss-timeline .mss-tl-dot{margin:0}
  .mss-timeline .mss-tl-label{margin-top:0}
}


.mss-timeline .mss-tl-dot-inner{
  width:100%;height:100%;
  border-radius:999px;
  background:#fff;
  padding:var(--mss-tl-ring,8px);
  box-shadow: 0 14px calc(var(--mss-tl-shadow,18) * 3px) rgba(2,6,23,.12);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.mss-timeline .mss-tl-dot-inner img{width:58%;height:58%;object-fit:contain;border-radius:0}


/* ==========================
   Statistics (ملاذ في أرقام)
   ========================== */
.mss-stats{
  position:relative;
  width:100%;
  max-width:var(--mss-stats-section-w, 100%);
  margin-left:auto;
  margin-right:auto;
  padding:64px 0;
  background:var(--mss-stats-bg-custom, radial-gradient(circle at 25% 18%, rgba(37,99,235,.10), rgba(255,255,255,0) 45%), radial-gradient(circle at 85% 80%, rgba(30,169,124,.12), rgba(255,255,255,0) 46%), linear-gradient(180deg,#fff,#fbfbfd));
  overflow:hidden;
}
.mss-stats:before{
  content:"";
  position:absolute;inset:-60px;
  background:radial-gradient(circle at 50% 50%, rgba(2,6,23,.04), rgba(255,255,255,0) 56%);
  pointer-events:none;
  opacity:.85;
}
.mss-stats .mss-container{max-width:var(--mss-stats-w,1200px);margin:0 auto;padding:0 18px;position:relative;z-index:2}
.mss-stats .mss-head{text-align:center}
.mss-stats .mss-title{font-family:var(--mss-h-font);font-weight:900;font-size:34px;margin:0;color:#0f172a;letter-spacing:-.02em}
.mss-stats .mss-subtitle{font-family:var(--mss-b-font);font-weight:700;font-size:var(--mss-faq-qfs,16px);margin:10px auto 0;max-width:860px;color:#64748b;line-height:1.95}

.mss-stats-grid{
  margin-top:34px;
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:18px;
}

.mss-stats-card{
  position:relative;
  border-radius:var(--mss-stats-card-radius,26px);
  background:var(--mss-stats-card-bg,#fff);
  border:1px solid var(--mss-stats-card-border, rgba(15,23,42,.10));
  padding:26px 18px;
  text-align:center;
  box-shadow:0 calc(var(--mss-stats-card-shadow,18)*1px) calc(var(--mss-stats-card-shadow,18)*3.2px) rgba(2,6,23,.10);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  will-change:transform;
}
.mss-stats-card:after{
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.75), rgba(255,255,255,0) 55%);
  opacity:.0;
  transition:opacity .28s ease;
  pointer-events:none;
}
.mss-stats-card:hover{
  transform:translateY(-6px);
  border-color:rgba(37,99,235,.25);
  box-shadow:0 calc((var(--mss-stats-card-shadow,18) + 8)*1px) calc((var(--mss-stats-card-shadow,18) + 8)*3.3px) rgba(2,6,23,.14);
}
.mss-stats-card:hover:after{opacity:.7}

.mss-stats-icon{
  width:92px;height:92px;
  margin:0 auto 18px;
  border-radius:999px;
  background:var(--mss-stats-icon-bg, rgba(37,99,235,.10));
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 18px 60px rgba(2,6,23,.12);
  display:flex;align-items:center;justify-content:center;
  color:var(--mss-stats-accent,#2563eb);
}
.mss-stats-icon svg{width:46px;height:46px;display:block}
.mss-stats-icon img{width:58%;height:58%;object-fit:contain;display:block}

.mss-stats-value{font-family:var(--mss-h-font);font-weight:950;font-size:34px;letter-spacing:-.02em;color:var(--mss-stats-number,#0b1220)}
.mss-stats-label{font-family:var(--mss-b-font);font-weight:800;font-size:16px;margin-top:8px;color:var(--mss-stats-label,#64748b)}

/* in-view entrance */
.mss-stats .mss-stats-card{opacity:0;transform:translateY(14px);}
.mss-stats.is-inview .mss-stats-card{animation:mss-stats-in .7s ease forwards;animation-delay:calc(var(--i,0)*.08s)}
@keyframes mss-stats-in{to{opacity:1;transform:none}}

@media (max-width:1024px){
  .mss-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .mss-stats{padding:52px 0}
  .mss-stats-grid{grid-template-columns:1fr;gap:14px}
  .mss-stats .mss-title{font-size:30px}
}

/* ============================
   Testimonials (آراء المرضى)
   ============================ */
.mss-testimonials{
  position:relative;
  padding:78px 0;
  max-width:var(--mss-ts-section-w, 100%);
  margin:0 auto;
  background:var(--mss-ts-bg-custom, radial-gradient(circle at 25% 18%, rgba(37,99,235,.10), rgba(255,255,255,0) 45%), radial-gradient(circle at 85% 80%, rgba(14,165,233,.10), rgba(255,255,255,0) 46%), linear-gradient(180deg,#fff,#fbfbfd));
}
.mss-testimonials::before{
  content:"";
  position:absolute;inset:0;
  background:var(--mss-ts-bgimg, none);
  background-size:cover;background-position:center;
  opacity:var(--mss-ts-bgimg-opacity,0);
  pointer-events:none;
}
.mss-testimonials::after{
  content:"";
  position:absolute;inset:0;
  background:var(--mss-ts-overlay, transparent);
  opacity:var(--mss-ts-overlay-op,0);
  pointer-events:none;
}
.mss-testimonials .mss-container{max-width:var(--mss-ts-w,1200px);margin:0 auto;padding:0 18px;position:relative;z-index:2}
.mss-testimonials .mss-head{text-align:center}
.mss-testimonials .mss-title{font-family:var(--mss-h-font);font-weight:900;font-size:36px;margin:0;color:#0f172a;letter-spacing:-.02em}
.mss-testimonials .mss-subtitle{font-family:var(--mss-b-font);font-weight:700;font-size:16px;margin:10px auto 0;max-width:920px;color:#64748b;line-height:1.95}

.mss-ts-slider{position:relative;margin-top:38px}
.mss-ts-viewport{overflow-x:auto;overflow-y:hidden;border-radius:24px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;direction:ltr}
.mss-ts-track{display:flex;flex-direction:row;gap:var(--mss-ts-gap,22px);padding:6px;scroll-snap-align:start}
.mss-ts-card{scroll-snap-align:start;flex:0 0 calc((100% - (var(--mss-ts-gap,22px) * 2)) / 3);background:var(--mss-ts-card-bg,#fff);border:1px solid var(--mss-ts-card-border, rgba(15,23,42,.10));border-radius:var(--mss-ts-card-radius,26px);box-shadow:none;padding:26px 24px;position:relative}
.mss-ts-quote{position:absolute;right:18px;bottom:12px;font-size:78px;line-height:1;color:var(--mss-ts-quote, rgba(15,23,42,.08));font-family:var(--mss-h-font);font-weight:900;pointer-events:none;user-select:none}
.mss-ts-text{font-family:var(--mss-b-font);font-weight:700;font-size:15px;line-height:2;color:var(--mss-ts-text,#475569);min-height:104px}
.mss-ts-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}
.mss-ts-name{font-family:var(--mss-h-font);font-weight:900;font-size:16px;color:var(--mss-ts-name,#0b1220)}
.mss-ts-stars{display:inline-flex;gap:4px;align-items:center}
.mss-ts-stars svg{width:16px;height:16px}

.mss-ts-arrow{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:14px;border:1px solid rgba(15,23,42,.10);background:rgba(255,255,255,.85);backdrop-filter:blur(10px);box-shadow:0 14px 40px rgba(2,6,23,.10);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3}
.mss-ts-arrow.is-prev{right:-8px}
.mss-ts-arrow.is-next{left:-8px}
.mss-ts-arrow:disabled{opacity:.45;cursor:not-allowed}

.mss-ts-dots{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:18px}
.mss-ts-dot{width:8px;height:8px;border-radius:99px;background:var(--mss-ts-dot-off, rgba(15,23,42,.18));opacity:.8;cursor:pointer;transition:transform .2s ease, opacity .2s ease}
.mss-ts-dot.is-active{background:var(--mss-ts-dot,#f59e0b);transform:scale(1.35);opacity:1}

.mss-ts-cta{display:flex;justify-content:center;margin-top:26px}
.mss-ts-btn{display:inline-flex;gap:10px;align-items:center;justify-content:center;padding:12px 18px;border-radius:var(--mss-ts-btn-radius,999px);background:var(--mss-ts-btn-bg,#0ea5e9);color:var(--mss-ts-btn-text,#fff);border:1px solid var(--mss-ts-btn-border, rgba(2,6,23,.08));box-shadow:0 18px 50px rgba(2,6,23,.16);cursor:pointer;font-family:var(--mss-h-font);font-weight:900}
.mss-ts-btn .dashicons{font-size:18px;line-height:1}

/* Modal */
.mss-ts-modal{position:fixed;inset:0;z-index:9999;display:none}
.mss-ts-modal.is-open{display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:calc(var(--mss-ts-modal-top, 170px)) 14px 26px}
.mss-ts-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.55);backdrop-filter:blur(6px)}
.mss-ts-modal-card{position:relative;z-index:2;max-width:560px;width:100%;background:#fff;border-radius:26px;padding:22px 20px 18px;box-shadow:0 26px 90px rgba(2,6,23,.35);border:1px solid rgba(255,255,255,.55)}
.mss-ts-modal-x{position:absolute;left:14px;top:12px;width:38px;height:38px;border-radius:14px;border:1px solid rgba(15,23,42,.10);background:#fff;cursor:pointer;font-size:22px;line-height:1}
.mss-ts-modal-title{margin:0;font-family:var(--mss-h-font);font-weight:900;font-size:20px;color:#0f172a}
.mss-ts-modal-sub{margin:8px 0 12px;font-family:var(--mss-b-font);font-weight:700;color:#64748b;line-height:1.85}
.mss-ts-field{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.mss-ts-field span{font-family:var(--mss-b-font);font-weight:900;color:#0f172a;font-size:13px}
.mss-ts-field input,.mss-ts-field textarea{border:1px solid rgba(15,23,42,.12);border-radius:16px;padding:12px 12px;font-family:var(--mss-b-font);font-weight:700;outline:none;transition:border-color .18s ease, box-shadow .18s ease}
.mss-ts-field input:focus,.mss-ts-field textarea:focus{border-color:rgba(14,165,233,.55);box-shadow:0 0 0 4px rgba(14,165,233,.18)}
.mss-ts-field textarea{resize:vertical;min-height:120px}
.mss-ts-submit{width:100%;margin-top:10px;padding:12px 14px;border-radius:16px;border:1px solid rgba(2,6,23,.08);background:#0f172a;color:#fff;font-family:var(--mss-h-font);font-weight:900;cursor:pointer}
.mss-ts-msg{margin-top:10px;font-family:var(--mss-b-font);font-weight:800;color:#0f172a;line-height:1.75}

.mss-ts-rate{display:inline-flex;gap:6px;align-items:center;direction:ltr}
.mss-ts-rate button{width:38px;height:38px;border-radius:12px;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:transform .12s ease, filter .12s ease}
.mss-ts-rate button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.mss-ts-rate svg{width:22px;height:22px}

@media (max-width:680px){
  .mss-ts-modal.is-open{padding:calc(var(--mss-ts-modal-top, 170px)) 14px 22px}
}

@media (max-width:1024px){
  .mss-ts-card{flex-basis:calc((100% - var(--mss-ts-gap,22px)) / 2)}
  .mss-testimonials{padding:66px 0}
}
@media (max-width:680px){
  .mss-ts-card{flex-basis:100%}
  .mss-ts-arrow{display:none}
  .mss-testimonials .mss-title{font-size:30px}
}


/* ============================
   Doctors (Flip Cards Slider)
   ============================ */
.mss-doctors{position:relative;padding:70px 0;max-width:var(--mss-doc-section-w, 100%);margin:0 auto;
  background:var(--mss-doc-bg-custom, radial-gradient(circle at 25% 18%, rgba(37,99,235,.10), rgba(255,255,255,0) 45%), radial-gradient(circle at 85% 80%, rgba(30,169,124,.10), rgba(255,255,255,0) 46%), linear-gradient(180deg,#fff,#fbfbfd));
  /* Typography: force Tajawal for section & headings */
  font-family: "Tajawal", system-ui, -apple-system, Segoe UI, Arial;
  --mss-h-font: "Tajawal", system-ui, -apple-system, Segoe UI, Arial;
  --mss-b-font: "Tajawal", system-ui, -apple-system, Segoe UI, Arial;
}
.mss-doctors:before{content:"";position:absolute;inset:0;pointer-events:none;background:var(--mss-doc-bgimg, none);background-size:cover;background-position:center;opacity:var(--mss-doc-bgimg-opacity,0);filter:saturate(1.02) contrast(1.02)}
.mss-doctors:after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--mss-doc-overlay, transparent);opacity:var(--mss-doc-overlay-op,0)}
.mss-doctors .mss-container{max-width:var(--mss-doc-w,1200px);margin:0 auto;padding:0 18px;position:relative;z-index:2}

.mss-doc-slider{position:relative;margin-top:38px}
.mss-doc-viewport{overflow-x:auto;overflow-y:hidden;border-radius:24px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;direction:ltr}
.mss-doc-track{display:flex;flex-direction:row;gap:var(--mss-doc-gap,18px);padding:6px}
.mss-doc-card{scroll-snap-align:start;flex:0 0 calc((100% - (var(--mss-doc-gap,18px) * 3)) / 4);perspective:1100px}
.mss-doc-inner{position:relative;width:100%;height:320px;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.9,.2,1)}
.mss-doc-card:hover .mss-doc-inner{transform:rotateY(180deg)}
.mss-doc-front,.mss-doc-back{position:absolute;inset:0;border-radius:var(--mss-doc-radius,26px);border:1px solid var(--mss-doc-border, rgba(15,23,42,.10));overflow:hidden;backface-visibility:hidden}
.mss-doc-front{background:#fff;box-shadow:0 18px 50px rgba(2,6,23, calc(var(--mss-doc-shadow,14) / 100))}
.mss-doc-back{background:var(--mss-doc-back,#fff);transform:rotateY(180deg);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:22px;gap:10px;box-shadow:0 18px 50px rgba(2,6,23, calc(var(--mss-doc-shadow,14) / 100))}
.mss-doc-imgwrap{position:absolute;inset:0}
.mss-doc-imgwrap img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02) contrast(1.02)}
.mss-doc-imgwrap:after{content:"";position:absolute;inset:-40%;background:linear-gradient(120deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%);transform:translateX(-60%) rotate(8deg);opacity:0;transition:opacity .2s ease;pointer-events:none}
.mss-doctors{--_shine:var(--mss-doc-shine,1)}
.mss-doc-card:hover .mss-doc-imgwrap:after{opacity:calc(var(--_shine));animation:mssDocShine 1.15s ease}
@keyframes mssDocShine{from{transform:translateX(-70%) rotate(8deg)}to{transform:translateX(70%) rotate(8deg)}}

.mss-doc-name{font-family:var(--mss-h-font);font-weight:900;font-size:18px;color:var(--mss-doc-name,#0b1220)}
.mss-doc-spec{font-family:var(--mss-b-font);font-weight:700;font-size:var(--mss-faq-afs,14px);color:var(--mss-doc-spec,#64748b);line-height:1.8}
.mss-doc-social{display:flex;gap:10px;justify-content:center;margin-top:6px}
.mss-doc-soc{width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--mss-doc-social-bg, rgba(37,99,235,.10));color:var(--mss-doc-social,#2563eb);border:1px solid rgba(15,23,42,.08);transition:transform .2s ease, filter .2s ease}
.mss-doc-soc:hover{transform:translateY(-2px);filter:brightness(.98)}
.mss-doc-soc svg{width:20px;height:20px}

.mss-doc-arrow{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:14px;border:1px solid var(--mss-doc-arrow-border, rgba(15,23,42,.10));background:var(--mss-doc-arrow-bg, rgba(255,255,255,.85));backdrop-filter:blur(10px);box-shadow:0 14px 40px rgba(2,6,23,.10);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;color:var(--mss-doc-arrow,#0b1220)}
.mss-doc-arrow.is-prev{right:-8px}
.mss-doc-arrow.is-next{left:-8px}
.mss-doc-arrow:disabled{opacity:.45;cursor:not-allowed}

.mss-doc-dots{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:18px}
.mss-doc-dot{width:8px;height:8px;border-radius:99px;background:var(--mss-doc-dot-off, rgba(15,23,42,.18));opacity:.8;cursor:pointer;transition:transform .2s ease, opacity .2s ease}
.mss-doc-dot.is-active{background:var(--mss-doc-dot,#2563eb);transform:scale(1.35);opacity:1}

@media (max-width:1024px){
  .mss-doc-card{flex-basis:calc((100% - (var(--mss-doc-gap,18px) * 1)) / 2)}
}
@media (max-width:680px){
  .mss-doctors{padding:54px 0}
  .mss-doc-card{flex-basis:100%}
  .mss-doc-inner{height:300px}
  .mss-doc-arrow{width:40px;height:40px;border-radius:14px}
}

/* =============================
   FAQ (الأسئلة الشائعة)
   ============================= */
.mss-faq{position:relative;isolation:isolate;padding:78px 0;background:var(--mss-faq-bg-custom, transparent);font-family:'Tajawal','Almarai','Alexandria',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;max-width:var(--mss-faq-section-w,100%);margin:0 auto}
.mss-faq::before{content:"";position:absolute;inset:0;background-image:var(--mss-faq-bgimg, none);background-size:cover;background-position:center;opacity:var(--mss-faq-bgimg-opacity,.14);z-index:-2;pointer-events:none}
.mss-faq::after{content:"";position:absolute;inset:0;background:var(--mss-faq-overlay,#fff);opacity:var(--mss-faq-overlay-op,0);z-index:-1;pointer-events:none}

.mss-faq .mss-container{max-width:var(--mss-faq-w,1200px);margin:0 auto;padding:0 18px}
.mss-faq-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--mss-faq-gap,28px);align-items:start}

.mss-faq-accordion{display:grid;gap:14px}
.mss-faq-item{background:var(--mss-faq-item-bg,#fff);border:1px solid var(--mss-faq-item-border,rgba(15,23,42,.12));border-radius:var(--mss-faq-item-radius,14px);overflow:hidden;box-shadow:0 16px 45px rgba(2,6,23,.06)}
.mss-faq-item.is-open{border-color:var(--mss-faq-active-border,rgba(22,163,74,.30));background:var(--mss-faq-active-bg,#fff)}

.mss-faq-q{width:100%;display:flex;gap:14px;align-items:center;justify-content:space-between;padding:16px 18px;background:transparent;border:0;cursor:pointer;text-align:var(--mss-faq-text-align,right);direction:var(--mss-faq-dir,rtl)}
.mss-faq-qtext{color:var(--mss-faq-q,#0b1220);font-weight:900;font-size:16px;line-height:1.7}

.mss-faq-ic{width:40px;height:40px;border-radius:14px;background:var(--mss-faq-ic-bg,rgba(2,6,23,.06));display:flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:0 8px 22px rgba(2,6,23,.08)}
.mss-faq-plus{width:16px;height:16px;position:relative;display:block}
.mss-faq-plus::before,.mss-faq-plus::after{content:"";position:absolute;inset:0;margin:auto;background:var(--mss-faq-ic,#0b1220);border-radius:99px}
.mss-faq-plus::before{width:16px;height:2px}
.mss-faq-plus::after{width:2px;height:16px;transition:transform .22s ease}
.mss-faq-item.is-open .mss-faq-plus::after{transform:scaleY(0)}

.mss-faq-a{padding:0 18px 16px 18px}
.mss-faq-ainner{padding-top:2px;color:var(--mss-faq-a,#64748b);font-weight:700;font-size:14px;line-height:1.95}

.mss-faq-panel{padding:14px 0}
.mss-faq-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(22,163,74,.14);color:#166534;border:1px solid rgba(22,163,74,.22);border-radius:999px;padding:10px 14px;font-weight:900;margin-bottom:18px}
.mss-faq-title{margin:0 0 14px 0;color:var(--mss-faq-panel-title,#0b1220);font-weight:900;font-size:32px;line-height:1.35}

.mss-faq-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.mss-faq-list li{position:relative;padding-right:18px;color:var(--mss-faq-panel-text,#64748b);font-weight:800;line-height:1.85}
.mss-faq-list li::before{content:"";position:absolute;right:0;top:.9em;width:8px;height:8px;border-radius:3px;background:rgba(30,64,175,.35)}

.mss-faq-btn{margin-top:22px;display:inline-flex;align-items:center;gap:12px;text-decoration:none;background:var(--mss-faq-btn-bg,#166534);color:var(--mss-faq-btn,#fff);border:1px solid var(--mss-faq-btn-border,rgba(22,101,52,.25));border-radius:999px;padding:14px 18px 14px 14px;font-weight:900;box-shadow:0 calc(var(--mss-faq-btn-shadow,16) * 1px) 36px rgba(2,6,23,.14);transition:transform .18s ease, filter .18s ease}
.mss-faq-btn:hover{transform:translateY(-2px);filter:brightness(1.02)}
.mss-faq-btnic{width:40px;height:40px;border-radius:999px;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center}
.mss-faq-btnic .dashicons{width:20px;height:20px;font-size:20px}

@media (max-width:1024px){
  .mss-faq{padding:64px 0}
  .mss-faq-title{font-size:28px}
}
@media (max-width:860px){
  .mss-faq-grid{grid-template-columns:1fr}
  .mss-faq-panel{padding:0}
}
@media (max-width:520px){
  .mss-faq-title{font-size:24px}
  .mss-faq-qtext{font-size:var(--mss-faq-qfs,15px)}
}

/* ===================== Blog Boxes (Home) ===================== */
.mss-section.mss-blog{
  position:relative;
  overflow:hidden;
  direction:rtl;
  padding: clamp(22px, 2.6vw, 48px) 0;
  font-family: var(--mss-b-font);
  color: var(--mss-text);
  /* prevent any unwanted heavy shadow under the section */
  box-shadow:none !important;
  filter:none !important;
  background: var(--mss-blog-bg, transparent);
}
.mss-section.mss-blog::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--mss-blog-bg-img, none);
  background-size: cover;
  background-position: center;
  opacity: var(--mss-blog-bg-op, 0);
  pointer-events: none;
}
.mss-section.mss-blog .mss-container{
  width:min(var(--mss-container, 1200px), 92%);
  margin:0 auto;
  position: relative;
  z-index: 1;
}
.mss-blog__head{margin-bottom:16px}
.mss-blog__title{margin:0 0 8px;font-family:var(--mss-h-font);font-weight:900;font-size:clamp(22px,2.2vw,34px)}
.mss-blog__desc{margin:0;opacity:.85;font-weight:800;color:var(--mss-muted)}

.mss-blog__grid{
  display:grid;
  grid-template-columns:repeat(var(--mss-cols,3), minmax(0,1fr));
  gap: var(--mss-gap,16px);
}
@media (max-width: 1024px){
  .mss-blog__grid{grid-template-columns:repeat(var(--mss-cols-t,2), minmax(0,1fr));}
}
@media (max-width: 520px){
  .mss-blog__grid{grid-template-columns:repeat(var(--mss-cols-m,1), minmax(0,1fr));}
}

.mss-blog__slider{position:relative}
.mss-blog__nav{display:flex;gap:10px;justify-content:flex-end;margin:10px 0}
.mss-blog__btn{
  width:42px;height:42px;border-radius:16px;cursor:pointer;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.86);
  box-shadow:0 16px 44px rgba(2,6,23,.10);
  font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;
  transition:transform .15s ease, box-shadow .15s ease;
}
.mss-blog__btn:hover{transform:translateY(-1px);box-shadow:0 24px 66px rgba(2,6,23,.14)}

.mss-blog__track{
  display:flex;
  gap: var(--mss-gap,16px);
  overflow:auto;
  scroll-behavior:smooth;
  padding:4px 2px;
  scrollbar-width: none;
}
.mss-blog__track::-webkit-scrollbar{display:none}

.mss-blog-card{
  background:linear-gradient(180deg,#fff,#fbfbfd);
  border:1px solid rgba(15,23,42,.06);
  border-radius: var(--mss-radius-lg);
  /* user requested: no shadow on cards */
  box-shadow: none;
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.mss-blog-card:hover{transform:translateY(-4px);box-shadow:none;border-color:rgba(37,99,235,.18)}

.mss-blog-card__link{color:inherit;text-decoration:none;display:block}

.mss-blog-card__media{
  position:relative;
  height: 190px;
  margin: 12px 12px 0;
  border-radius: var(--mss-radius-md);
  background-size:cover;
  background-position:center;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.06);
}

.mss-blog-card__badge{
  position:absolute;top:12px;left:12px;
  padding:8px 10px;
  border-radius:999px;
  color:#fff;
  font-weight:900;
  font-size:12px;
  background: rgba(2,6,23,.68);
  backdrop-filter: blur(10px);
  border:1px solid rgba(255,255,255,.14);
}

.mss-blog-card__shine{
  position:absolute;inset:-60% -60%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 65%);
  transform: translateX(-65%) rotate(18deg);
  transition: transform .55s ease;
  pointer-events:none;
  opacity:.85;
}
.mss-blog-card:hover .mss-blog-card__shine{transform: translateX(55%) rotate(18deg)}

.mss-blog-card__body{padding: 12px 16px 16px}
.mss-blog-card__title{margin: 10px 0 8px;font-family:var(--mss-alt-font);font-weight:900;font-size:18px;line-height:1.35}
.mss-blog-card__excerpt{margin:0 0 12px;opacity:.85;font-weight:800;color:var(--mss-muted);line-height:1.8;font-size:14px}

.mss-blog-card__meta{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:12px;font-weight:900;color:#475569;opacity:.9}
.mss-blog-card__date,.mss-blog-card__views{display:inline-flex;gap:6px;align-items:center}

/* slider card widths */
.mss-blog__slider .mss-blog-card{min-width:320px;max-width:320px}
@media (max-width:520px){.mss-blog__slider .mss-blog-card{min-width:86vw;max-width:86vw}}

/* ===================== Single Post Template (Malaz) ===================== */
.mss-article-page{direction:rtl;font-family:var(--mss-b-font);color:var(--mss-text);padding: 22px 0 44px;
  background:
    radial-gradient(circle at 15% 10%, rgba(37,99,235,.08), rgba(255,255,255,0) 46%),
    radial-gradient(circle at 90% 80%, rgba(30,169,124,.10), rgba(255,255,255,0) 44%),
    linear-gradient(180deg,#fff,#fbfbfd);
}
.mss-article-container{width:min(var(--mss-article-outer,1180px), 92%);margin:0 auto}
.mss-article-layout{display:grid;grid-template-columns: minmax(0,1fr) minmax(260px, 360px);gap: var(--mss-article-gap,18px);align-items:start}
.mss-article-layout.is-no-sidebar{grid-template-columns: 1fr}

.mss-article-card{background:linear-gradient(180deg,#fff,#fbfbfd);border:1px solid rgba(15,23,42,.06);border-radius: var(--mss-radius-xl);box-shadow: var(--mss-shadow-2);overflow:hidden}
.mss-article-card__in{padding: 18px}

.mss-article-hero{margin: 14px;border-radius: var(--mss-radius-lg);overflow:hidden;border:1px solid rgba(15,23,42,.06);box-shadow: var(--mss-shadow-1);position:relative}
.mss-article-hero img{display:block;width:100%;height:auto;max-height:420px;object-fit:cover}
.mss-article-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,0),rgba(2,6,23,.08));pointer-events:none}

.mss-article-title{margin: 0 0 10px;font-family:var(--mss-h-font);font-weight:900;font-size:clamp(24px,2.4vw,40px);line-height:1.2}
.mss-article-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  font-weight:900;
  color:#475569;
  margin: 10px 0 18px;
  padding:10px 12px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 14px 40px rgba(2,6,23,.06);
  width:fit-content;
}
.mss-article-chip{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.14)}

.mss-article-content{line-height:2.05;font-size:16px;color:#0b1220}
.mss-article-content p{margin: 0 0 14px}
.mss-article-content h2, .mss-article-content h3{font-family:var(--mss-alt-font);font-weight:900;margin:18px 0 10px}

.mss-article-side{display:flex;flex-direction:column;gap:14px}
.mss-article-box{background:linear-gradient(180deg,#fff,#fbfbfd);border:1px solid rgba(15,23,42,.06);border-radius: var(--mss-radius-xl);box-shadow: var(--mss-shadow-1);padding:14px}
.mss-article-box__title{font-weight:900;font-family:var(--mss-alt-font);margin-bottom:10px}

.mss-article-cats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.mss-article-cats a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;border-radius:18px;border:1px solid rgba(15,23,42,.06);background:#fff;text-decoration:none;color:inherit;font-weight:900;box-shadow:0 14px 40px rgba(2,6,23,.06);transition:transform .15s ease, box-shadow .15s ease}
.mss-article-cats a:hover{transform:translateY(-1px);box-shadow:0 22px 60px rgba(2,6,23,.10)}
.mss-article-pill{min-width:34px;text-align:center;padding:4px 10px;border-radius:999px;background:rgba(15,23,42,.08);font-size:12px}

.mss-article-list{display:flex;flex-direction:column;gap:10px}
.mss-article-item{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;padding:10px;border-radius:18px;border:1px solid rgba(15,23,42,.06);background:#fff;box-shadow:0 14px 40px rgba(2,6,23,.06);transition:transform .15s ease, box-shadow .15s ease}
.mss-article-item:hover{transform:translateY(-1px);box-shadow:0 22px 60px rgba(2,6,23,.10)}
.mss-article-item__img{width:48px;height:48px;border-radius:16px;background-size:cover;background-position:center;border:1px solid rgba(15,23,42,.06)}
.mss-article-item__t{font-weight:900;font-size:13px;line-height:1.35}
.mss-article-item__m{font-weight:900;font-size:12px;color:var(--mss-muted);margin-top:2px}

.mss-share{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.mss-share__a, .mss-share__btn{display:inline-flex;gap:8px;align-items:center;justify-content:center;padding:10px 12px;border-radius:16px;border:1px solid rgba(15,23,42,.08);background:linear-gradient(180deg,#fff,#fbfbfd);color:inherit;text-decoration:none;font-weight:900;box-shadow:0 16px 44px rgba(2,6,23,.10);cursor:pointer;position:relative;overflow:hidden;transition:transform .15s ease, box-shadow .15s ease}
.mss-share__a:before, .mss-share__btn:before{content:"";position:absolute;inset:-70% -70%;background:linear-gradient(120deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.6) 50%,rgba(255,255,255,0) 65%);transform:translateX(-60%) rotate(18deg);transition:transform .55s ease;opacity:.9}
.mss-share__a:hover:before, .mss-share__btn:hover:before{transform:translateX(55%) rotate(18deg)}
.mss-share__a:hover, .mss-share__btn:hover{transform:translateY(-1px);box-shadow:0 24px 66px rgba(2,6,23,.14)}
.mss-share__ico{width:18px;height:18px;display:inline-block}

.mss-related{margin-top:18px}
.mss-related__title{margin:0 0 12px;font-family:var(--mss-alt-font);font-weight:900}
.mss-related__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:1024px){.mss-related__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.mss-related__grid{grid-template-columns:1fr}}
.mss-related__card{border:1px solid rgba(15,23,42,.06);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 14px 40px rgba(2,6,23,.08);transition:transform .15s ease, box-shadow .15s ease}
.mss-related__card:hover{transform:translateY(-2px);box-shadow:0 22px 60px rgba(2,6,23,.12)}
.mss-related__img{height:140px;background-size:cover;background-position:center}
.mss-related__body{padding:12px}
.mss-related__t{margin:0;font-weight:900;font-size:14px;line-height:1.4}
.mss-related__e{display:block;margin-top:6px;font-size:12px;line-height:1.75;color:var(--mss-muted);font-weight:800;opacity:.95}

.mss-article-contact{display:flex;flex-direction:column;gap:12px}
.mss-contact-card{
  display:flex;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  border-radius:20px;
  border:1px solid rgba(15,23,42,.06);
  background:linear-gradient(180deg,#fff,#fbfbfd);
  box-shadow:0 16px 44px rgba(2,6,23,.08);
  text-decoration:none;
  color:inherit;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  position:relative;
  overflow:hidden;
}
.mss-contact-card:before{content:"";position:absolute;inset:-70% -70%;background:linear-gradient(120deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 65%);transform:translateX(-60%) rotate(18deg);transition:transform .55s ease;opacity:.85}
.mss-contact-card:hover:before{transform:translateX(55%) rotate(18deg)}
.mss-contact-card:hover{transform:translateY(-1px);box-shadow:0 24px 66px rgba(2,6,23,.12);border-color:rgba(37,99,235,.18)}
.mss-contact-ic{width:44px;height:44px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.14);font-size:18px;flex:0 0 auto}
.mss-contact-txt{display:flex;flex-direction:column;gap:2px;font-weight:900;line-height:1.25}
.mss-contact-k{font-size:12px;color:var(--mss-muted)}
.mss-contact-v{font-size:14px;color:#0b1220}

/* Comments (keep inside the article card) */
.mss-comments{margin-top:18px}
.mss-comments .commentlist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.mss-comments .comment-body{background:#fff;border:1px solid rgba(15,23,42,.06);border-radius:22px;box-shadow:0 14px 40px rgba(2,6,23,.06);padding:12px 14px}
.mss-comments .comment-author{font-weight:900}
.mss-comments .comment-metadata{font-weight:800;color:var(--mss-muted);font-size:12px;margin-top:4px}
.mss-comments .comment-content{margin-top:10px;line-height:1.9}
.mss-comments .reply a{display:inline-block;margin-top:8px;font-weight:900;text-decoration:none}
.mss-comments .reply a:hover{text-decoration:underline}
.mss-comments form input[type="text"],
.mss-comments form input[type="email"],
.mss-comments form input[type="url"],
.mss-comments form textarea{width:100%;max-width:100%;border-radius:18px;border:1px solid rgba(15,23,42,.10);padding:12px 14px;background:#fff;box-shadow:0 14px 40px rgba(2,6,23,.06)}
.mss-comments form textarea{min-height:120px}
.mss-comments form input:focus,
.mss-comments form textarea:focus{outline:none;box-shadow:0 0 0 4px rgba(37,99,235,.16)}
.mss-comments form input[type="submit"]{border:0;border-radius:18px;padding:12px 16px;font-weight:900;cursor:pointer;box-shadow:0 18px 55px rgba(2,6,23,.14)}

@media (max-width:980px){
  .mss-article-layout{grid-template-columns:1fr}
}

/* Blog widget helpers */
.mss-blog-slider__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0}
.mss-blog-globe{display:none !important}


/* =========================
   Malaz Footer
   ========================= */
.mss-site-footer{direction:rtl;font-family:"Tajawal",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:#fff;border-top:1px solid rgba(15,23,42,.08);margin-top:28px;position:relative;overflow:hidden}
.mss-site-footer.mss-foot-hasbg:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(135deg,rgba(29,78,216,var(--mss-foot-bg-a,0)) 0%,rgba(59,130,246,var(--mss-foot-bg-a,0)) 35%,rgba(245,158,11,var(--mss-foot-bg-a,0)) 100%)}
.mss-site-footer.mss-foot-hasbg>*{position:relative;z-index:1}
.mss-foot-container{max-width:var(--mss-foot-max-width,1240px);margin:0 auto;padding:18px 18px}
.mss-footer-newsletter{background:#f3f7ff;border-top:1px solid rgba(15,23,42,.06);border-bottom:1px solid rgba(15,23,42,.06)}
.mss-footer-newsletter .mss-foot-container{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.mss-nl-title{font-family:"Alexandria","Tajawal",sans-serif;font-weight:900;color:#0b1220;font-size:22px}
.mss-nl-desc{margin-top:6px;color:#51627c;font-weight:700}
.mss-nl-form{display:flex;align-items:center;gap:10px;flex-wrap:nowrap}
.mss-nl-input{flex:1;min-width:180px;width:auto;border-radius:14px;border:1px solid rgba(15,23,42,.12);padding:12px 14px;background:#fff;box-shadow:0 18px 52px rgba(2,6,23,.08);font-weight:700}
.mss-nl-input:focus{outline:none;box-shadow:0 0 0 4px rgba(37,99,235,.16),0 10px 26px rgba(2,6,23,.06);border-color:rgba(37,99,235,.35)}
.mss-nl-btn{border:0;border-radius:14px;padding:12px 18px;background:#16a34a;color:#fff;font-weight:900;cursor:pointer;box-shadow:0 14px 40px rgba(22,163,74,.25);white-space:nowrap}
.mss-nl-btn:hover{filter:brightness(.97)}
.mss-footer-main{background:#fff}
.mss-foot-grid{display:grid;grid-template-columns:var(--mss-foot-brand-col,320px) 1fr 1fr 1fr var(--mss-foot-qr-col,220px);gap:var(--mss-foot-gap,22px);align-items:start}
.mss-foot-col{min-width:0}
.mss-foot-title{font-family:"Alexandria","Tajawal",sans-serif;font-weight:900;color:#0b1220;font-size:18px;margin-bottom:12px}
.mss-foot-links{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.mss-foot-links a{color:#52637d;text-decoration:none;font-weight:700}
.mss-foot-links a:hover{color:#1d4ed8;text-decoration:underline}
.mss-foot-qr .mss-qr-img{width:170px;height:170px;object-fit:contain;border:1px solid rgba(15,23,42,.08);border-radius:10px;background:#fff;padding:8px}
.mss-foot-qr .mss-qr-ph{width:170px;height:170px;border:1px dashed rgba(15,23,42,.18);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-weight:900}
.mss-store-row{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:nowrap}
.mss-store-btn{display:inline-flex;align-items:center;justify-content:center;flex:1 1 0;height:42px;min-width:0;border-radius:10px;border:1px solid rgba(15,23,42,.10);background:#0b1220;color:#fff;text-decoration:none;overflow:hidden}
.mss-store-btn img{height:42px;width:auto;display:block}
.mss-store-mini{font-weight:900;font-size:13px;padding:0 12px}
.mss-foot-brand .mss-brand-head{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:10px}
.mss-brand-logo{width:56px;height:56px;border-radius:14px;object-fit:cover;border:1px solid rgba(15,23,42,.08);background:#fff}
.mss-brand-name{font-family:"Alexandria","Tajawal",sans-serif;font-weight:900;color:#0b1220;font-size:26px;line-height:1}
.mss-brand-desc{color:#51627c;font-weight:700;line-height:1.9;margin-top:6px}
.mss-cert-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.mss-cert-row img{height:34px;width:auto;object-fit:contain;border:1px solid rgba(15,23,42,.08);border-radius:10px;background:#fff;padding:6px}
.mss-footer-bottom{background:#fff;border-top:1px solid rgba(15,23,42,.08)}
.mss-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.mss-social{display:flex;align-items:center;gap:10px}
.mss-social-link{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;border:1px solid rgba(15,23,42,.10);background:#fff;color:#0b1220;text-decoration:none}
.mss-social-link:hover{background:#f1f5ff;border-color:rgba(37,99,235,.25);color:#1d4ed8}
.mss-bottom-links{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mss-bottom-links a{color:#52637d;text-decoration:none;font-weight:800}
.mss-bottom-links a:hover{color:#1d4ed8;text-decoration:underline}
.mss-copy{text-align:right}
.mss-copy-link,.mss-copy-link:visited{color:#16a34a;text-decoration:none;font-weight:900}
.mss-copy-link:hover,.mss-copy-link:active,.mss-copy-link:focus{color:#16a34a;text-decoration:underline}
.mss-copy-sub{color:#6b7c96;font-weight:700;margin-top:4px}

@media (max-width:1100px){
  .mss-foot-grid{grid-template-columns:1fr 1fr 1fr var(--mss-foot-qr-col,220px);}
  .mss-foot-brand{grid-column:1/-1}
}
@media (max-width:780px){
  .mss-foot-grid{grid-template-columns:1fr 1fr; }
  .mss-foot-brand{grid-column:1/-1}
  .mss-foot-qr{grid-column:1/-1}
  .mss-copy{text-align:right}
}

@media (max-width:520px){
  .mss-foot-grid{grid-template-columns:1fr;}
  .mss-store-row{flex-wrap:wrap}
  .mss-footer-newsletter .mss-foot-container{flex-wrap:wrap}
  .mss-nl-form{width:100%;gap:8px}
  .mss-nl-input{min-width:0}
  .mss-nl-btn{padding:12px 14px}
}



/* Courses Categories Page */
.mss-courses-page{max-width:1180px;margin:0 auto;padding:26px 16px}
.mss-courses-hero{background:linear-gradient(135deg, rgba(34,197,94,.10), rgba(2,132,199,.08));border:1px solid rgba(15,23,42,.08);border-radius:28px;padding:22px 22px;margin-bottom:18px}
.mss-courses-title{margin:0 0 6px;font-size:30px;line-height:1.2}
.mss-courses-sub{margin:0;color:var(--mss-muted);font-size:15px}
.mss-courses-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:14px}
@media(max-width: 980px){.mss-courses-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width: 620px){.mss-courses-grid{grid-template-columns:1fr}}
.mss-coursecat{display:block;text-decoration:none;color:inherit;border-radius:26px;overflow:hidden;background:rgba(255,255,255,.88);border:1px solid rgba(15,23,42,.08);box-shadow:var(--mss-shadow-1);transform:translateY(0);transition:transform .18s ease, box-shadow .18s ease}
.mss-coursecat:hover{transform:translateY(-3px);box-shadow:var(--mss-shadow-2)}
.mss-coursecat-media{position:relative;height:190px;overflow:hidden}
.mss-coursecat.is-child .mss-coursecat-media{height:170px}
.mss-coursecat-media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.02)}
.mss-coursecat-glow{position:absolute;inset:0;background:radial-gradient(1200px 300px at 20% 20%, rgba(34,197,94,.22), transparent 55%), radial-gradient(900px 260px at 80% 30%, rgba(2,132,199,.18), transparent 60%);mix-blend-mode:screen;opacity:.9;pointer-events:none}
.mss-coursecat-shine{position:absolute;top:-40%;left:-60%;width:55%;height:200%;background:linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);transform:rotate(18deg) translateX(-40%);opacity:.0;pointer-events:none}
.mss-coursecat:hover .mss-coursecat-shine{opacity:.9;animation:mssShine 1.0s ease both}
@keyframes mssShine{to{transform:rotate(18deg) translateX(260%);}}
.mss-coursecat-badge{position:absolute;top:12px;right:12px;background:rgba(15,23,42,.72);color:#fff;padding:6px 10px;border-radius:999px;font-size:12px;backdrop-filter:blur(8px)}
.mss-coursecat-body{padding:14px 14px 16px}
.mss-coursecat-title{margin:0 0 6px;font-size:18px}
.mss-coursecat-desc{margin:0;color:var(--mss-muted);font-size:13.5px;line-height:1.6}
.mss-courses-empty{max-width:1180px;margin:20px auto;padding:18px 16px;border:1px dashed rgba(15,23,42,.18);border-radius:18px;color:var(--mss-muted)}


/* Courses list cards (optional when filtering by category) */
.mss-courses-picked{margin:18px 0 10px}
.mss-courses-picked-title{margin:0 0 10px;font-size:20px}
.mss-courses-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width: 980px){.mss-courses-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width: 620px){.mss-courses-cards{grid-template-columns:1fr}}
.mss-coursecard{border:1px solid rgba(15,23,42,.08);border-radius:22px;overflow:hidden;background:rgba(255,255,255,.92);box-shadow:var(--mss-shadow-1)}
.mss-coursecard-media{height:160px;overflow:hidden}
.mss-coursecard-media img{width:100%;height:100%;object-fit:cover;display:block}
.mss-coursecard-body{padding:12px 12px 14px}
.mss-coursecard-title{margin:0 0 6px;font-size:16px}
.mss-coursecard-desc{margin:0;color:var(--mss-muted);font-size:13.5px;line-height:1.6}


/* Hide horizontal scrollbars for MSS sliders (still swipeable) */
.mss-ts-viewport::-webkit-scrollbar,
.mss-doc-viewport::-webkit-scrollbar{display:none}
.mss-ts-viewport,.mss-doc-viewport{scrollbar-width:none;-ms-overflow-style:none}
