@font-face {
font-family: "Cairo";
src: url("../eHotline/Cairo.ttf");
} 
   /* ===== Reset + Mobile-first hard lock ===== */
    *{box-sizing:border-box}
    html,body{height:100%;width:100%;max-width:100%;margin:0;padding:0;overflow-x:hidden}
    body{font-family:'Cairo',system-ui,-apple-system,Segoe UI,Roboto,Arial;background:#fff;color:#0b0f16;overscroll-behavior:y none}
    img{max-width:100%;display:block}
    a{text-decoration:none;color:inherit}

    /* ===== Tokens ===== */
    :root{--red:#ff0000;--muted:#6b7280;--stroke:#eceff4;--card:#fff;--shadow:0 8px 24px rgba(0,0,0,.08);--pad:clamp(12px,4.5vw,16px);--gap:clamp(10px,4vw,14px);--ico:clamp(22px,7vw,28px);--fs-0:clamp(.86rem,3.4vw,.95rem);--fs-1:clamp(1rem,4.2vw,1.15rem)}

    /* ===== App fills the screen ===== */
    .app{inline-size:100vw;max-inline-size:100vw;min-block-size:100dvh;display:grid;grid-template-rows:auto auto 1fr auto;background:#fff;overflow-x:hidden}

    /* ===== Header (logo right + bar left) ===== */
/* ===== Header – logo أكبر + اسم وسلوغان ===== */
/* ===== Header PATCH: bigger logo + safe-area + no clipping ===== */
.header{
  position: sticky; top: 0; z-index: 60;
  background: #fff; border-bottom: 1px solid #eceff4;
  backdrop-filter: blur(8px);
}

.header-in{
  display: grid;
  grid-template-columns: 1fr auto;   /* يمين: براند — شمال: eHotline bar */
  align-items: center;
  gap: 12px;

  /* padding يحسب الـsafe-area عشان الكلام ما يتقصّش */
  padding-inline: max(12px, env(safe-area-inset-left))
                  max(12px, env(safe-area-inset-right));
  padding-block: calc(env(safe-area-inset-top, 0px) + 12px) 12px;

  /* ارفع الهيدر فعليًا */
  min-height: clamp(72px, 18vw, 96px);
  overflow: visible;   /* منع قصّ المحتوى */
}

.brand-right{ display:flex; align-items:center; gap:12px; min-width:0 }

.logo{
  width: clamp(64px, 16vw, 84px);   /* لوجو أكبر */
  height: auto; flex: 0 0 auto;
}

.brand-text{
  min-width:0; display:flex; flex-direction:column; justify-content:center;
}

.brand-name{
  margin:0;
  font-weight:900;
  font-size: clamp(1.2rem, 5.4vw, 1.7rem);
  line-height: 1.25;           /* سطر أعلى لتفادي القصّ */
  color:#0b0f16;
  /* اسم ممكن ينزل سطرين بدون قصّ */
  white-space: normal; overflow: visible; text-overflow: clip;
}

.brand-slogan{
  margin:.2rem 0 0;
  color:#6b7280;
  font-weight:700;
  font-size: clamp(.9rem, 3.6vw, 1rem);
  line-height: 1.35;           /* مساحة كفاية للنقاط/التشكيل */
  white-space: normal; overflow: visible;
}

.hotline-left{ min-width:0 }
.hotline-left .bar{
  max-height: clamp(30px, 7vw, 40px); /* يتصغّر لو المساحة ضاقت */
  width: auto; display:block; object-fit: contain;
}

/* شاشات صغيرة جدًا */
@media (max-width: 360px){
  .logo{ width: 60px }
  .brand-name{ font-size: 1.15rem }
  .brand-slogan{ font-size: .88rem }
  .hotline-left .bar{ max-height: 28px }
}


/* تِكر الأخبار (لو موجود) */
.ticker{
  display:flex; align-items:center; gap:8px;
  padding: 8px max(12px, env(safe-area-inset-left))
           8px max(12px, env(safe-area-inset-right));
  border-top: 1px solid #eceff4;
  font-weight: 800; font-size: clamp(.85rem,3.2vw,.95rem);
  overflow:hidden;
}
.dot{ width:8px; height:8px; border-radius:999px; background:#ff0000 }
.marquee{ white-space:nowrap; animation:scroll 20s linear infinite }
@keyframes scroll{ from{transform:translateX(10%)} to{transform:translateX(-100%)} }
@media (prefers-reduced-motion: reduce){ .marquee{ animation: none } }
/* ===== النسخة العربية (من اليمين لليسار) ===== */
.marquee-ar {
  direction: ltr;
  animation: scroll-ltr 20s linear infinite;
}
@keyframes scroll-ltr {
  from { transform: translateX(100%); }
  to   { transform: translateX(-100%); }
}
    /* Ticker */
    .ticker{border-block-start:1px solid var(--stroke);display:flex;align-items:center;gap:8px;padding:8px var(--pad);font-weight:700;font-size:var(--fs-0);overflow:hidden}
    .dot{inline-size:8px;block-size:8px;border-radius:999px;background:var(--red)}
    .marquee{white-space:nowrap;animation:scroll 20s linear infinite}
    @keyframes scroll{from{transform:translateX(10%)}to{transform:translateX(-100%)}}
    @media (prefers-reduced-motion:reduce){.marquee{animation:none}}

    /* ===== Noor Branches Banner ===== */
/* ===== Noor Branches Banner — Fresh Hero (mobile-first) ===== */
/* ===== Noor Branches — Premium Hero (drop-in) ===== */
.noor-branches-banner{
  --ink:#0b0f16; --muted:#6b7280; --line:#e7ecf4;
  --accent: var(--red, #ff0000);
  --rad:22px; --pad:clamp(16px,3.6vw,22px);
  position:relative; margin:12px var(--pad) 0; border-radius:var(--rad);
  /* بطاقة زجاجية + حد جراديانت هادئ */
  background:
    linear-gradient(#fff,#fff) padding-box,
    radial-gradient(140% 140% at 100% -10%, #f6f9ff, #ffffff) border-box;
  border:1px solid transparent;
  box-shadow:0 20px 48px rgba(16,38,84,.08);
}
.noor-branches-banner .nbb-wrap{
  display:grid; grid-template-columns:1fr; gap:14px;
  padding:var(--pad); min-width:0; min-height:200px; align-items:center;
}

/* === الخريطة: كرت مدوّر، الصورة كاملة، عمق فخم === */
.noor-branches-banner .nbb-visual{ position:relative; min-height:170px; display:grid; place-items:center; }
.noor-branches-banner .nbb-map{
  /* الصورة كاملة بلا قصّ */
  background-image:url('../logo/alexandria-map.png'); /* عدّلي المسار لو لزم */
  background-size:contain; background-repeat:no-repeat; background-position:center;

  /* الكرت */
  inline-size: clamp(260px, 82vw, 420px);
  aspect-ratio: 4/3; border-radius:18px; overflow:hidden;
  padding: clamp(8px,2.2vw,12px); background-origin:content-box;

  /* حد جراديانت + عمق داخلي */
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(180deg,#eaf1fb,#f6f9ff) border-box,
    url('../logo/alexandria-map.png') center/contain no-repeat; /* fallback للصورة */

  border:1px solid transparent;
  box-shadow:
    0 18px 36px rgba(16,38,84,.12),           /* ظل خارجي */
    inset 0 0 0 1.2px #dfe7f3,                /* حد داخلي خفيف */
    inset 0 -12px 22px rgba(0,0,0,.05);       /* تظليل سفلي */
  filter: saturate(1.08) contrast(1.06) brightness(1.02);
  -webkit-mask:none !important; mask:none !important; /* إلغاء أي ماسكات قديمة */
}

/* لمعة زجاجية رقيقة + “مخدة” ظل أسفل الخريطة */
.noor-branches-banner .nbb-map::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  border-radius:inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,0) 55%);
  mix-blend-mode:screen; opacity:.8;
}
.noor-branches-banner .nbb-map::after{
  content:""; position:absolute; left:50%; bottom:-14px; transform:translateX(-50%);
  width:70%; height:28px; border-radius:999px;
  background: radial-gradient(60% 100% at 50% 50%, rgba(16,38,84,.18), rgba(16,38,84,0));
  filter: blur(6px); opacity:.5;
}

/* الدبوس مع جلو بسيط */
.noor-branches-banner .nbb-pin{
  position:absolute; left:50%; top:64%; transform:translate(-50%,-50%);
  inline-size:48px; block-size:48px; color:var(--accent);
  filter: drop-shadow(0 16px 22px rgba(224,4,65,.28));
  animation:bobPin 3s ease-in-out infinite;
}
@keyframes bobPin{0%,100%{transform:translate(-50%,-50%) translateY(0)}50%{transform:translate(-50%,-50%) translateY(-4px)}}
.noor-branches-banner .pin-ico{ inline-size:100%; block-size:100% }

/* العنوان والنص */
.noor-branches-banner .nbb-title{
  margin:0; text-align:center;
  font:800 clamp(1.08rem,4.2vw,1.35rem)/1.35 'Cairo',system-ui; color:var(--ink);
  text-wrap:balance; letter-spacing:.1px;
}
.noor-branches-banner .nbb-sub{
  margin:.35rem auto 0; text-align:center; max-inline-size:40ch;
  color:var(--muted); font:600 clamp(.9rem,3.6vw,1rem)/1.7 'Cairo',system-ui;
}

/* الأزرار */
.noor-branches-banner .nbb-cta{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center }
.noor-branches-banner .nbb-btn{
  --h:44px; display:inline-flex; align-items:center; gap:8px; block-size:var(--h);
  padding:0 16px; border-radius:999px; font:800 .95rem/1 'Cairo',system-ui;
  border:1px solid transparent; transition:.2s ease; will-change:transform;
}
.noor-branches-banner .nbb-btn:hover{ transform:translateY(-1px) }
.noor-branches-banner .nbb-btn:not(.ghost){
  background:linear-gradient(135deg,#ff0000,#ff0000); color:#fff;
  box-shadow:0 10px 22px rgba(224,4,65,.24);
}
.noor-branches-banner .nbb-btn.ghost{ background:#fff; color:#0b0f16; border-color:#e7ecf4 }
/* توحيد ستايل الشيب للـ <a> و <button> */
.chip,
a.chip,
button.chip{
  display:inline-flex; align-items:center; justify-content:center;
  gap:6px;
  padding:8px 12px;
  border-radius:999px;
  border:1px dashed var(--accent, #ff0000);
  background:#fff; color:var(--accent, #ff0000);
  text-decoration:none; cursor:pointer;

  /* ← أهم سطرين لتوحيد الخط */
  font-family: "Cairo", system-ui;
  font-weight:800; font-size:13px; line-height:1;

  /* إزالة اختلافات أزرار المتصفح */
  -webkit-appearance: none; appearance: none;
  border-width:1px; /* بعض المتصفحات بتزودها */
  letter-spacing:.1px;
}

/* هوفر اختياري */
.chip:hover{ box-shadow:0 6px 16px rgba(255,0,0,.10) }

/* شاشات أوسع: محاذاة يسار */
@media (min-width:760px){
  .noor-branches-banner .nbb-wrap{ grid-template-columns:1.1fr 2fr auto; min-height:220px }
  .noor-branches-banner .nbb-visual{ min-height:200px }
  .noor-branches-banner .nbb-title,.noor-branches-banner .nbb-sub{ text-align:start; margin-inline:0 }
  .noor-branches-banner .nbb-cta{ justify-content:flex-start }
}

/* دعم ريتنا للصورة لو متوفر @2x */
@supports (background-image: image-set(url('x') 1x)) {
  .noor-branches-banner .nbb-map{
    background-image:
      linear-gradient(#fff,#fff),
      linear-gradient(180deg,#eaf1fb,#f6f9ff),
      image-set(url('../logo/alexandria-map.png') 1x, url('../logo/alexandria-map@2x.png') 2x);
    background-repeat:no-repeat,no-repeat,no-repeat;
    background-position:0 0,0 0,center;
    background-size:auto,auto,contain;
  }
}


/* ===== Larger screens: split layout ===== */
@media (min-width: 760px){
  .noor-branches-banner .nbb-wrap{
    grid-template-columns: 1.1fr 2fr auto; min-height: 220px;
  }
  .noor-branches-banner .nbb-visual{ min-height: 200px }
  .noor-branches-banner .nbb-title{ text-align:start }
  .noor-branches-banner .nbb-sub{ text-align:start; margin-inline:0 }
  .noor-branches-banner .nbb-cta{ justify-content:flex-start }
}


/* مساحة الهيرو للخريطة */
.noor-branches-banner .nbb-visual{
  position: relative;
  min-height: 180px;                 /* لا يغيّر ارتفاع البلوك العام */
  display: grid; place-items: center;
}

/* الخريطة داخل “كرت” مدوّر — الصورة كاملة */
.noor-branches-banner .nbb-map{
  /* المسار الأساسي للصورة */
  background-image: url('../logo/alexandria-map.png'); /* عدّلي المسار لو مختلف */

  /* ❗ نعرض الصورة كاملة بلا قصّ */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
   border-radius: 16px;

  /* إطار الكرت */
  inline-size: clamp(220px, 80vw, 420px);
  aspect-ratio: 4 / 3;               /* عدّليها لنسبة صورتك الحقيقية إن لزم */
  border-radius: 16px;
   

  /* تنفّس داخلي بسيط عشان الصورة ما تلزقش في الأطراف */
  padding: clamp(8px, 2.2vw, 12px);
  background-origin: content-box;

  /* عمق خفيف وحدّ أنيق */
  border: 1px solid #e6ebf3;
  box-shadow: 0 18px 34px rgba(16,38,84,.12);
  filter: saturate(1.06) contrast(1.05) brightness(1.02);

  /* 🔕 نعطّل أي ماسكات/بلوبات سابقة */
  -webkit-mask: none !important;
          mask: none !important;
}
.noor-branches-banner .nbb-map::before{ display: none !important; } /* إلغاء اللمعة القديمة */

/* البن في المنتصف سفليًا */
.noor-branches-banner .nbb-pin{
  position: absolute;
  left: 50%; top: 62%;               /* موضع لطيف فوق الحافة السفلية */
  transform: translate(-50%, -50%);
  width: 46px; height: 46px;
  color: var(--accent, #e11d48);
  filter: drop-shadow(0 16px 22px rgba(225,29,72,.26));
}
.noor-branches-banner .pin-ico{ width:100%; height:100%; }

    /* ===== Hero cards ===== */
    .hero{padding:var(--pad);display:grid;gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr))}
    .kcard{background:var(--card);border:1px solid var(--stroke);border-radius:18px;padding:var(--pad);box-shadow:var(--shadow);display:flex;align-items:center;gap:12px;min-width:0}
    .kico{inline-size:clamp(28px,7vw,34px);block-size:clamp(28px,7vw,34px);display:grid;place-items:center;border-radius:12px;background:#fff4f6;color:var(--red)}
    .kcard b{display:block;font-size:13px}
    .kcard span{color:var(--muted);font-size:9px;  margin-top:6px!important; display: block;}

    /* ===== Grid actions — 2 cols on phones, 3 above 480px ===== */
    .grid{padding:6px var(--pad) 18px;display:grid;gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr))}
    @media(min-width:480px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
    .tile{min-width:0;background:#fff;border:1px solid var(--stroke);border-radius:18px;padding:14px 10px;text-align:center;box-shadow:var(--shadow);transition:transform .12s}
    .tile:active{transform:scale(.985)}
    .tile .ico{inline-size:var(--ico);block-size:var(--ico);margin:0 auto 8px;display:grid;place-items:center;border-radius:14px;background:#fff;border:1px solid var(--stroke);font-size:clamp(18px,6vw,22px)}
    .tile small{display:block;color:var(--muted);font-size:calc(var(--fs-0) - .05rem)}

    /* ===== Bottom dock ===== */
    .dock{position:sticky;inset-block-end:0;z-index:30;background:rgba(255,255,255,.98);border-block-start:1px solid var(--stroke);backdrop-filter:blur(8px)}
    .dock-in{display:grid;gap:6px;padding:8px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left));grid-template-columns:repeat(4,1fr)}
    .btn{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1px solid var(--stroke);border-radius:16px;padding:10px 6px;font-size:var(--fs-0)}

    /* ===== FAB + bubble ===== */
    .store-fab{position:fixed;inset-inline-end:max(14px,env(safe-area-inset-right));inset-block-end:calc(86px + env(safe-area-inset-bottom));z-index:45;inline-size:56px;block-size:56px;border:0;border-radius:999px;display:grid;place-items:center;background:var(--red);color:#fff;box-shadow:0 10px 28px rgba(224,4,65,.35)}
    .store-fab svg{inline-size:24px;block-size:24px}
    .store-bubble{position:fixed;inset-inline-end:calc(env(safe-area-inset-right) + 14px + 56px + 8px);inset-block-end:calc(86px + env(safe-area-inset-bottom));z-index:46;max-inline-size:210px;background:#fff;color:#111;border:1px solid var(--stroke);border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.14);padding:10px 12px;font-weight:800;font-size:.95rem;opacity:0;transform:translateY(8px) scale(.96);pointer-events:none;transition:opacity .28s ease, transform .28s ease}
    .store-bubble:before{content:"";position:absolute;inset-inline-end:-6px;inset-block-end:14px;inline-size:12px;block-size:12px;background:#fff;border-inline-start:1px solid var(--stroke);border-block-end:1px solid var(--stroke);transform:rotate(45deg)}
    .store-bubble.show{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
 
/* ===== Fixed, Responsive Footer (tight spacing) ===== */
:root{
  --footer-h: 64px;
}

/* خلّي محتوى الصفحة ما يتغطّاش بالفوتر */
html,body{overflow-x:hidden}
body{padding-bottom: calc(var(--footer-h) + env(safe-area-inset-bottom, 0px))}

/* الفوتر */
.footer{
  position: fixed;
  inset-inline: 0;                 /* right & left */
  inset-block-end: 0;              /* bottom */
  z-index: 60;

  background: #fff;
  border-top: 1px solid #eceff4;
  box-shadow: 0 -6px 18px rgba(0,0,0,.06);

  padding:
    8px max(10px, env(safe-area-inset-right))
    calc(8px + env(safe-area-inset-bottom))
    max(10px, env(safe-area-inset-left));

  /* 6 عناصر بعرض واحد + فجوة صغيرة */
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
}

/* عنصر */
.footer .fitem{
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:4px; min-height:48px;
  padding:6px 2px;
  border-radius:12px;
  background:#fff;
  text-align:center;
  -webkit-tap-highlight-color: transparent;
}
.footer .fitem:active{ transform:scale(.98) }

/* أيقونة داخل دائرة */
.footer .ico{
  display:grid; place-items:center;
  inline-size:34px; block-size:34px;
  border-radius:999px;
  background:#ff0000
;
  border:1px solid #eef2f7;
}

/* صورة الأيقونة — تُعرض حتى لو بيضا */
.footer .f-ico{
  inline-size:22px; block-size:22px;
  object-fit: contain; display:block;
  /* لو الأيقونات بيضا، الدروب-شادو يوضحها */
  filter: drop-shadow(0 0 1px rgba(0,0,0,.25));
}

/* النص */
.footer small{
  font-weight:600;
  font-size:.48rem; line-height:1;
  white-space:nowrap; overflow:hidden; 
 
  color:#000000;
  margin-top:3px; display:block;
}

 
/* === Soft Blue Icon Background (like your screenshot) === */
:root{
  --ico-bg1:#fbfdff;     /* أعلى الخلفية */
  --ico-bg2:#f3f6fb;     /* أسفل الخلفية */
  --ico-border:#dfe7f3;  /* الحد */
  --ico-shadow:0 2px 8px rgba(9,39,94,.08); /* ظل خارجي */
}

/* طبّقيها على أيقونات الفوتر */
.footer .ico{
  display:grid; place-items:center;
  width: clamp(34px, 7vw, 40px);
  height: clamp(34px, 7vw, 40px);
  border-radius: 12px;                       /* مربع مدوّر */
  background: linear-gradient(180deg, var(--ico-bg1), var(--ico-bg2));
  border: 1px solid var(--ico-border);
  box-shadow:
    var(--ico-shadow),
    inset 0 1px 0 rgba(255,255,255,.9),      /* لمعة داخلية خفيفة من فوق */
    inset 0 -2px 6px rgba(28,76,146,.06);    /* تظليل خفيف من تحت */
}

/* الأيقونة (الصورة) نفسها */
.footer .f-ico{
  width: clamp(20px, 5vw, 22px);
  height: auto; object-fit:contain; display:block;
  /* توضيح أيقونات فاتحة جدًا */
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.6))
          drop-shadow(0 0 1px rgba(0,49,126,.22));
  opacity:.96;
}

/* إحساس الضغط */
.footer .fitem:active .ico{
  transform: translateY(1px);
  box-shadow:
    0 1px 6px rgba(9,39,94,.10),
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -2px 6px rgba(28,76,146,.08);
}

/* لو حابة نفس الخلفية لأيقونات الجريد فوق: */
.grid .ico{
  width: clamp(38px, 8vw, 44px);
  height: clamp(38px, 8vw, 44px);
  border-radius: 14px;
  background: linear-gradient(180deg, var(--ico-bg1), var(--ico-bg2));
  border: 1px solid var(--ico-border);
  box-shadow:
    var(--ico-shadow),
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -2px 6px rgba(28,76,146,.06);
}
.grid .ico > img{ width: 24px; height: 24px; object-fit:contain; }




/* زر المتجر – دائرة جراديانت أزرق مع حركة خفيفة */
.store-fab{
  position:fixed;
  inset-inline-end:max(14px, env(safe-area-inset-right));
  inset-block-end:calc(86px + env(safe-area-inset-bottom));
  z-index:70;
  inline-size:56px; block-size:56px;
  border:0; border-radius:999px;
  display:grid; place-items:center;
background: linear-gradient(145deg, #e00441 10%, #f1c85b 100%);
box-shadow: 0 8px 20px rgba(224, 4, 65, .25);
color: #fff;

  color:#fff;
  box-shadow:0 10px 28px rgba(13,110,253,.35);
  animation:bob 2.6s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.store-fab svg{inline-size:24px; block-size:24px}

/* فقاعة الرسالة – بيضا، ظل، كورنر كبير، ثابتة */
.store-bubble{
  position:fixed;
  inset-inline-end:calc(env(safe-area-inset-right) + 14px + 56px + 8px);
  inset-block-end:calc(86px + env(safe-area-inset-bottom));
  z-index:71;

  padding:10px 14px;
  max-inline-size:min(62vw, 260px);
  background:#fff;
  color:#0b0f16;
  border:1px solid #e6ebf3;
  border-radius:16px;          /* نفس شكل الصورة */
  box-shadow:0 10px 24px rgba(0,0,0,.14);

  font-weight:400; font-size:.75rem;
  white-space:nowrap;
  display:none;                 /* نظهرها بـ .show */
}
/* لو كان فيه ستايل قديم بذيل للفقاعة، نخفيه */
.store-bubble::before{ display:none !important; }

/* إظهار */
.store-bubble.show{ display:block; }




/* Back-to-top — fixed + hidden by default */
.backtop{
  position: fixed;
  right: max(14px, env(safe-area-inset-left));
  bottom: calc(86px + env(safe-area-inset-bottom));
  width: 46px; height: 46px;
  border-radius: 999px;
  border: 1px solid #e6ebf3;
  background: #fff;
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  display: grid; place-items: center;
  z-index: 1000;                 /* أعلى من الفوتر وأزرار أخرى */
  opacity: 0; transform: translateY(8px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.backtop.show{
  opacity: 1; transform: translateY(0);
  pointer-events: auto;
}
.backtop svg{ pointer-events: none }


 

/* أكبر أيقونة لتايل "اتصال" فقط */
.grid .tile.tile--lg-ico .ico{
  width: 72px !important;     /* كان ~34–40px */
  height: 72px !important;
  border-radius: 16px;
  padding: 0 !important;      /* لو فيه حشو كان مصغّر الصورة */
  display: grid; place-items: center;
  min-width: 72px;            /* يمنعها تصغر داخل الجريد */
}
.grid .tile.tile--lg-ico .ico-img{
  width: 44px !important;     /* حجم الأيقونة نفسه */
  height: 44px !important;
  object-fit: contain;
  transform: none;            /* إلغاء أي تصغير سابق */
  filter: drop-shadow(0 0 1px rgba(0,0,0,.12));
}

/* مسافة تحت الأيقونة */
.grid .tile.tile--lg-ico b{ margin-top: 8px; }






.noor-contacts{
  --accent:#e00441;
  --accent-2:#ffe9ee;
  --bg:#fafbfd;
  --line:#f7d4dc;
  --rad:28px;
  --pad:clamp(14px,3vw,18px);
  font-family:'Cairo', system-ui;
  background:linear-gradient(180deg,#fff,#fafbfd);
  padding:var(--pad);
}
.qc-wrap{max-width:880px;margin:0 auto 12px;display:grid;gap:10px}
.qc-item{
  display:flex;align-items:center;gap:12px;
  background:#fff;border-radius:var(--rad);
  border:1.5px solid var(--line);
  padding:14px 16px;text-decoration:none;color:#111;
  box-shadow:0 5px 14px rgba(224,4,65,.05);
  transition:.25s ease;
}
.qc-item:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(224,4,65,.12)}
.qc-ico{
  flex:0 0 52px;height:52px;display:grid;place-items:center;
  background:linear-gradient(180deg,#fff,#fff) padding-box,
             linear-gradient(135deg,var(--accent),rgba(224,4,65,.25)) border-box;
  border:1px solid transparent;border-radius:18px;
}
.qc-ico img{width:26px;height:26px}
.qc-text{display:flex;flex-direction:column;gap:2px}
.qc-label{font-weight:700;font-size:14px;color:#222}
.qc-value{font-weight:600;font-size:18px;color:#555;letter-spacing:.2px}
.qc-arrow{margin-inline-start:auto;font-size:22px;color:#d44b66;opacity:.4}

.card{
  max-width:880px;margin:12px auto 0;
  background:#fff;border-radius:20px;border:1.5px solid var(--line);
  padding:14px 16px;box-shadow:0 10px 30px rgba(224,4,65,.05);
}
.card-head{display:flex;align-items:center;gap:8px;color:#222;margin-bottom:8px}
.card-head svg{fill:none;stroke:currentColor;stroke-width:1.6}
.qc-address p{margin:4px 0}
.qc-address .en{color:#888;font-size:13px}
.addr-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.chip{
  background:#fff;border:1px dashed var(--accent);color:var(--accent);
  border-radius:999px;padding:8px 12px;font-size:13px;cursor:pointer;text-decoration:none
}
.chip.ghost{border-color:#ddd;color:#333}
.map-wrap{margin-top:10px;overflow:hidden;border-radius:14px;border:1px solid #eee}
.map-wrap iframe{width:100%;height:320px;display:block}


/* ===== Noor Breadcrumb Enhanced ===== */
.crumbs{
  background:linear-gradient(180deg,#fff,#fafbfe);
  border-block:1px solid #e9eef6;
  font-family:"Cairo",system-ui;
}
.crumbs-in{
  max-width:1100px;margin:0 auto;padding:10px 20px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.crumb{
  display:inline-flex;align-items:center;gap:6px;
  text-decoration:none;font-weight:600;font-size:11px;
  color:#1a1a1a;transition:.2s ease;
  padding:6px 12px;border-radius:999px;
  background:linear-gradient(180deg,#fff,#fff) padding-box,
             linear-gradient(135deg,#f9cfd9,#ffeef2) border-box;
  border:1px solid transparent;
  box-shadow:0 1px 0 rgba(224,4,65,.05);
}
.crumb svg{color:#e00441}
.crumb:hover{color:#e00441;box-shadow:0 6px 14px rgba(224,4,65,.08)}
.crumb.current{
  background:#e00441;color:#fff;
  border-color:#e00441;cursor:default;
  box-shadow:0 4px 10px rgba(224,4,65,.18);
}
.crumb.current:hover{color:#fff}
.sep{color:#aaa;font-size:13px;opacity:.6}




/* ===== Fixed footer bar (compact & crisp) ===== */
/* ---------- Footer ---------- */
.af-foot{
  position:fixed; left:0; right:0; bottom:0; z-index:1000;
  background:#fff; border-top:1px solid #e6ecf5;
  padding:6px 10px calc(6px + env(safe-area-inset-bottom));
  box-shadow:0 -8px 18px rgba(11,35,68,.08);
}
.af-tray{
  max-width:500px; margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:end;
}
.af-act{
  display:flex; flex-direction:column; align-items:center; gap:6px;
  color:#0b2344; font-weight:700; text-decoration:none;
}
.af-act .ico{
  width:48px; height:48px; border-radius:14px;
  display:grid; place-items:center;
  background:linear-gradient(180deg,#f6f9ff,#ffffff);
  border:1px solid #e6ecf5;
  box-shadow:0 6px 14px rgba(11,35,68,.10);
}
.af-act small{ font-size:12px; line-height:1 }
.af-act:active .ico{ transform:translateY(1px) }

/* ---------- Icons ---------- */
.af-icon{ width:22px; height:22px; display:block }
.af-icon.lg{ width:24px; height:24px }

/* ---------- Dark Mode (لو عندك body.dark) ---------- */
.dark .af-head .af-bar,
.dark .af-foot{
  background:linear-gradient(180deg,#0f2e5a,#0d2144);
  border-color:rgba(255,255,255,.12);
  box-shadow:none;
}
.dark .af-crumbs, 
.dark .af-crumbs a,
.dark .af-edit,
.dark .af-act{ color:#fff; text-shadow:0 1px 0 rgba(0,0,0,.35) }
.dark .af-act .ico{
  background:#fff; border-color:rgba(11,35,68,.12); box-shadow:0 6px 14px rgba(0,0,0,.28)
}

/* ---------- Responsive tweaks ---------- */
@media (max-width:480px){
  :root{ --af-headH: 50px; --af-footH: 68px; }
  .af-act small{ font-size:11px }
}




/* ===== Noor Facebook Embed Style ===== */
.noor-facebook{
  background:linear-gradient(180deg,#fff,#fafbfe);
  padding:30px 0;
  display:flex;justify-content:center;align-items:center;
  border-top:1px solid #f4d7d7;
}
.fb-wrap{
  background:#fff5f5;
  padding:20px;
  border-radius:24px;
  box-shadow:0 8px 30px rgba(255,0,0,.08);
  transition:.25s ease;
}
.fb-wrap:hover{
  box-shadow:0 12px 36px rgba(255,0,0,.12);
  transform:translateY(-2px);
}
.fb-wrap iframe{
  max-width:100%;
  display:block;
}


/* ===== Centered Facebook Embed (No scroll visible) ===== */
.noor-facebook{
  background:linear-gradient(180deg,#fff,#fff7f8);
  border-top:1px solid #ffe2e5;
  padding:40px 0 60px;
  display:flex;justify-content:center;
  font-family:"Cairo",system-ui;
}
.fb-wrap{
  text-align:center;
  background:#fff;
  border:1px solid #ffe2e5;
  border-radius:28px;
  padding:26px 20px;
  box-shadow:0 8px 30px rgba(255,0,0,.08);
  transition:.25s ease;
  width:fit-content;
}
.fb-wrap:hover{ box-shadow:0 12px 36px rgba(255,0,0,.12); }

.fb-title{
  display:flex;align-items:center;justify-content:center;gap:6px;
  font-weight:900;font-size:20px;margin:0;color:#1a1d22;
}
.fb-title svg{ color:#ff0000 }
.fb-sub{
  margin:6px 0 16px;
  color:#6b7280;font-weight:600;font-size:13px;
}
.fb-card{
  display:flex;justify-content:center;
  overflow:hidden; /* يمنع السكرول الجانبي */
}
.fb-card iframe{
  display:block;
  max-width:100%;
  border:0;
  border-radius:20px;
}
@media(max-width:480px){
  .fb-wrap{ width:90%; padding:20px 10px; }
  .fb-card iframe{ height:600px; }
}





/* ===== Vars ===== */
:root{
  --brand1:#ff0000; --brand2:#58ff33; --gold:#f1c85b;
  --ink:#0b0f16; --muted:#6b7280;
  --overlap: 56px;               /* نصف الكرت فوق التدرج */
}

/* ===== Hero ===== */
.noor-hero{
  background: linear-gradient(145deg, #e00441 0%, #ff7a3c 100%);
  color:#fff; border-radius:0 0 36px 36px;
  padding:48px 16px 50px; text-align:center; position:relative;
}
.noor-hero .wrap{max-width:920px; margin:0 auto;}
.t1{margin:0 0 8px; font:900 clamp(1.2rem,2.2vw,1.2rem)/1.2 "Cairo";}
.t1 span{color:var(--gold)}
.t2{margin:8px auto 18px; font:700 clamp(.9rem,2.8vw,.98rem)/1.7 "Cairo"; max-width:760px}

/* ===== CTAs — عمودين دائمًا ===== */
.ctas{
  display:grid; gap:12px;
  grid-template-columns:repeat(2, minmax(150px, 1fr)); /* ← ثابت عمودين */
  max-width:min(680px, 100%); margin:0 auto;
}
.cta{
  display:flex; flex-direction:row-reverse; align-items:center; gap:10px;
  padding:12px 14px; text-decoration:none; color:var(--ink);
  border-radius:18px; border:1px solid rgba(255,255,255,.6);
  background:linear-gradient(180deg,#ffffffcc,#ffffffe6);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}
.cta .ico{width:26px;height:26px;object-fit:contain}
.cta .txt b{display:block; font:900 clamp(.95rem,3.3vw,1rem) "Cairo"; color:var(--brand1)}
.cta .txt small{display:block; font:700 clamp(.74rem,2.8vw,.8rem) "Cairo"; color:var(--muted)}

/* ===== KPIs — ٣ أعمدة دائمًا + زجاجي بنفس شكل الصورة التانية ===== */
.noor-kpis{
  max-width:920px; margin:calc(-1 * var(--overlap)) auto 0; padding:0 16px;
  display:grid; gap:14px; grid-template-columns:repeat(3, minmax(120px, 1fr)); /* ← ثابت 3 */
}
.kpi{
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.9)) padding-box,
    radial-gradient(120% 160% at 10% -20%,rgba(255,255,255,.55),rgba(255,255,255,0)) border-box;
  border:1px solid rgba(255,255,255,.5);
  border-radius:22px; padding:18px 10px; text-align:center; color:var(--ink);
  box-shadow:0 16px 32px rgba(224,4,65,.18);
  backdrop-filter:blur(12px) saturate(140%); -webkit-backdrop-filter:blur(12px) saturate(140%);
}
.kpi strong{display:inline-flex; align-items:baseline; gap:2px; color:var(--brand1);
  font:900 clamp(1rem,3.6vw,1.2rem)/1 "Cairo"}
.kpi strong small{font:900 clamp(.8rem,3vw,.95rem) "Cairo"; color:var(--brand1)}
.kpi span{display:block; margin-top:6px; color:#6b7280; font:700 clamp(.75rem,2.8vw,.85rem)/1.3 "Cairo"}

/* لا نحولهم لعمود واحد أبداً */
@media (max-width:380px){
  .ctas{grid-template-columns:repeat(2, 1fr);}  /* يفضلوا عمودين */
  .noor-kpis{grid-template-columns:repeat(3, 1fr);} /* يفضلوا 3 */
  :root{ --overlap: 44px; } /* يقل التداخل على الشاشات الأصغر */
}



.noor-branches{
  background: linear-gradient(145deg, #e00441 0%, #ff7a3c 100%);
  border-radius:0 0 36px 36px;
  padding:32px 18px 60px;
  text-align:center;
}

.branches-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  max-width:600px;
  margin:0 auto;
}
 
 
 .noor-glassy{
  text-align:center;
  padding:24px 16px 36px;
}
.glassy-buttons{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

/* ============ الزر الزجاجي العام ============ */
.btn-glass{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 22px;
  border-radius:18px;
  text-decoration:none;
  font:800 .95rem "Cairo",system-ui;
  transition:.25s;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.6);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}
.btn-glass .ico{
  flex:0 0 auto;
  color:currentColor;
}

/* ============ ألوان ============ */
.btn-primary{
  color:#fff;
  background:linear-gradient(145deg,#e00441,#ff7a3c);
  box-shadow:0 8px 20px rgba(224,4,65,.22);
}
.btn-primary:hover{
  box-shadow:0 10px 26px rgba(224,4,65,.28);
  transform:translateY(-2px);
}

.btn-light{
  color:#0b0f16;
  background:rgba(255,255,255,.85);
}
.btn-light:hover{
  background:rgba(255,255,255,.95);
  transform:translateY(-2px);
}

/* ============ Responsive ============ */
@media (max-width:480px){
  .btn-glass{padding:10px 18px; font-size:.9rem;}
}
 
 /* ==== FIX: layout for glass buttons + KPIs ==== */

/* 1) مساحة كافية تحت الأزرار (ومن غير أي تراكب) */
.noor-glassy,
.pills-wrap,
.glassy-buttons,
.noor-actions { position:relative; z-index:3; }

.pills-wrap,
.glassy-buttons { 
  display:flex; gap:12px; align-items:center; justify-content:center; 
  flex-wrap:wrap; 
  margin: 6px auto 16px;       /* ↓ كانت صغيرة/صفر فكانت الكروت تطلع فوقها */
}

/* أبعاد موحّدة للأزرار */
.pill, .btn-glass {
  min-height: 44px;
  padding: 10px 18px;
  border-radius: 16px;
}

/* 2) منع أي تداخل للعدّادات: نشيل الـoverlap ونضبط الـmargin-top */
:root { --overlap: 0 !important; }             /* لو كان مُعرَّف قبل كده */
.noor-kpis {
  margin: 12px auto 0 !important;              /* لازم تكون موجبة */
  transform: none !important;
  position: relative; z-index: 2;
}

/* 3) تأكيد مسافة قاع البانر لو محتاج */
.noor-hero, .noor-branches, .noor-intro {
  padding-bottom: 56px;                        /* يمنع أي التصاق بصري */
}

/* 4) تحسين محاذاة الأيقونات والنص للأزرار RTL */
.pill, .btn-glass { flex-direction: row-reverse; }
.pill .ico, .btn-glass .ico { margin-inline-start: 0; }

/* 5) صغّري الظلال للمظهر الزجاجي الخفيف */
.pill, .btn-glass { box-shadow: 0 8px 20px rgba(0,0,0,.10); }
.noor-kpis .kpi { box-shadow: 0 12px 26px rgba(0,0,0,.10); }

/* 6) اطمئني على اتجاه الأرقام داخل الكروت */
.noor-kpis .kpi strong { direction: ltr; }

 /* ==== تحريك العدادات لأعلى بشكل أنيق ==== */
.noor-kpis {
  margin-top: -66px !important; /* ارفعي أو نزّلي برقم سالب أو موجب حسب الشكل */
  position: relative;
  z-index: 5;
  transition: margin .3s ease;
}

/* لو بتستخدمي متغير overlap */
:root { --overlap: 36px !important; } /* نفس القيمة موجب عشان تحافظي على المسافة الداخلية */

/* تحسين ظلّ الكروت */
.noor-kpis .kpi {
  box-shadow: 0 10px 24px rgba(224, 4, 65, .15);
}



/* ========== 3) Ring Grid (Quick actions) ========== */
.ring-grid{display:grid; grid-template-columns:repeat(var(--cols),1fr); gap:9px; padding:12px 14px}
.ring{
  position:relative; aspect-ratio:1; border-radius:24px; overflow:hidden; background:var(--card);
  border:1px solid var(--stroke); box-shadow:var(--shadow);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  text-decoration:none; color:var(--fg);
  transition:transform .18s ease, box-shadow .18s ease; 
}
/* 1) ثبّتي 3 أعمدة على الموبايل */
:root { --cols: 3; }                /* الافتراضي للموبايل */
@media (min-width: 520px){ :root{ --cols: 4; } }  /* التابلت وفوق */
@media (max-width: 360px){ :root{ --cols: 3; } }  /* ما تنزليش لـ2 أعمدة */

/* 2) كبّري الأيقونة داخل البلاطة بدون تغيير حجم البلاطة */
.ring {
  aspect-ratio: 1;                  /* تفضل مربعة */
  padding: 14px 10px;               /* مسافة داخلية تكفي للأيقونة الكبيرة */
  gap: 8px;
}
.ring img{
  /* حجم مرن يكبر على الشاشات الكبيرة ويظل كبير على الصغير */
  width: clamp(40px, 10vw, 46px);
  height: clamp(40px, 10vw, 46px);
  object-fit: contain;
  display: block;
}
.ring b{ font-size: 13px; }         /* سطر العنوان أوضح شوية */
.ring small{ font-size: 11px; color: var(--muted); }

/* (اختياري) لو فيه ستايل سابق كان محدد 28px، خلّي ده يتغلّب عليه */

/* ========== 4) Sections / Cards ========== */
.section{padding:6px 14px 14px}
.row{display:grid; gap:12px; grid-template-columns:1fr}
.card{background:var(--card); border:1px solid var(--stroke); border-radius:20px; box-shadow:var(--shadow); padding:14px}
.card h3{margin:0 0 6px; font-size:15px}
.meta{font-size:12px; color:var(--muted)}




.add-homescreen{
  --accent:#e00441;
  --accent2:#ff4f70;
  font-family:'Cairo',sans-serif;
  text-align:center;
  padding:40px 20px;
  background:linear-gradient(180deg,#fff,#f6f7fa);
  border-radius:28px;
  box-shadow:0 8px 28px rgba(0,0,0,.06);
  max-width:700px;
  margin:40px auto;
  backdrop-filter:blur(10px);
}

/* زر البانر */
.contact-item{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color:#0b0f16;
  padding:24px 20px;
  border-radius:22px;
  background:linear-gradient(#fff,#fff) padding-box,
             linear-gradient(135deg,var(--accent),var(--accent2)) border-box;
  border:2px solid transparent;
  box-shadow:0 10px 26px rgba(224,4,65,.2);
  transition:.3s;
}
.contact-item:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 30px rgba(224,4,65,.25);
}
.contact-item .icon img{
  width:64px;
  height:64px;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.15));
  margin-bottom:10px;
}
.labels b.ar{
  display:block;
  font-family:'Droid Arabic Kufi',sans-serif;
  font-size:1.1rem;
  margin-bottom:4px;
}
.labels small.en{
  display:block;
  font-family:'Righteous',cursive;
  color:#555;
  font-size:.9rem;
}

/* خطوات الصور */
.steps{
  margin-top:30px;
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  justify-items:center;
}
.steps img{
  width:280px;
  border-radius:20px;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  transition:transform .25s;
}
.steps img:hover{ transform:scale(1.04); }

@media (max-width:480px){
  .contact-item{ width:100%; }
  .steps img{ width:90%; }
}



.gps-guide{
  background:linear-gradient(180deg,#e00441 0%,#b80335 100%);
  color:#fff;
  border-radius:24px;
  padding:32px 20px;
  text-align:center;
  font-family:'Cairo', sans-serif;
  box-shadow:0 6px 24px rgba(0,0,0,.15);
}
.gps-title{
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  font-size:1.2rem;
  line-height:1.6;
  margin-bottom:24px;
}
.gps-title .ar{
  display:block;
  font-family:'Droid Arabic Kufi',sans-serif;
  font-weight:700;
  font-size:1rem;
}
.gps-links{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}
.gps-item{
  display:flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.15);
  border-radius:14px;
  padding:12px 18px;
  text-decoration:none;
  color:#fff;
  font-weight:600;
  transition:.3s;
}
.gps-item:hover{
  background:rgba(255,255,255,.25);
  transform:translateY(-3px);
}
.gps-item .icon img{
  width:38px;
  height:38px;
  object-fit:contain;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.2));
}
.gps-item .text{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  line-height:1.2;
}
.gps-item .text small{
  font-family:'Montserrat',sans-serif;
  font-size:.8rem;
  opacity:.9;
}


.offers-gallery{
  text-align:center;
  padding:-10px 20px;
  background:linear-gradient(180deg,#fff,#f6f7fa);
  border-radius:28px;
  box-shadow:0 8px 24px rgba(0,0,0,.05);
  font-family:'Cairo',sans-serif;
}
.offers-title{
  font-size:1.3rem;
  font-weight:800;
  color:#e00441;
  margin-bottom:24px;
}

/* الشبكة */
.offers-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;
  justify-items:center;
}
.offers-grid a{
  display:block;
  overflow:hidden;
  border-radius:25px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.offers-grid a:hover{
  transform:translateY(-4px) scale(1.03);
  box-shadow:0 10px 26px rgba(0,0,0,.12);
}
.offers-grid img{
  width:100%;
  height:auto;
  border-radius:25px;
  display:block;
}

/* موبايل */
@media (max-width:480px){
  .offers-grid{
    grid-template-columns:1fr;
  }
}





.partners{padding:44px 0;background:#fff}
.partners .wrap{width:min(1220px,92vw);margin:auto}
.sec-title{text-align:center;margin:0 0 18px;font-weight:900;color:#e00441}

.logos-marquee{
  position:relative; overflow:hidden; mask-image:linear-gradient( to left, transparent 0, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-image:linear-gradient( to left, transparent 0, #000 8%, #000 92%, transparent 100%);
  border-radius:18px; border:1px solid #eef1f7; background:#fafbff;
}
.track{
  display:flex; align-items:center; gap:14px; padding:14px;
  animation: slide 22s linear infinite;
}
.track.clone{ animation-name: slide2; position:absolute; inset:auto 0 0 0 }
@keyframes slide{
  from{ transform: translateX(0) }
  to  { transform: translateX(-100%) }
}
@keyframes slide2{
  from{ transform: translateX(100%) }
  to  { transform: translateX(0) }
}
/* توقف الحركة عند التفاعل أو تفضيل تقليل الحركة */
.logos-marquee:hover .track,
.logos-marquee:focus-within .track{ animation-play-state: paused }
@media (prefers-reduced-motion: reduce){
  .track, .track.clone{ animation: none }
}

.logo-card{
  width:160px; height:96px; flex:0 0 auto;
  background:#fff; border:1px solid #e8ebf3; border-radius:16px;
  display:grid; place-items:center; padding:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.05);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.logo-card img{
  max-width:100%; max-height:100%; object-fit:contain;
   
}
.logo-card:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.12); border-color:#dee3ef }
.logo-card:hover img{ filter:none; opacity:1 }

.center{display:flex; justify-content:center; margin-top:16px}
.btn.more{
  text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  padding:12px 18px; border-radius:14px; font-weight:900;
  background:linear-gradient(90deg,#e00441,#b80335); color:#fff; box-shadow:0 10px 24px rgba(224,4,65,.25);
}
.btn.more:hover{ transform:translateY(-2px) }
@media (max-width:720px){
  .logo-card{ width:136px; height:84px }
}




.contracts-static{
  padding:10px 0;
  background:#fafafa;
}
.contracts-wrap{
  width:min(1200px,90%);
  margin:auto;
  text-align:center;
}
.contracts-title{
  font-size:26px;
  color:#e00441;
  font-weight:900;
  margin-bottom:30px;
  letter-spacing:-.5px;
}

/* ===== شبكة اللوجوهات ===== */
.contracts-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(150px,1fr));
  gap:18px;
  justify-items:center;
}
.contract-card{
  width:100%;
  max-width:360px;
  aspect-ratio:2.8/1.4;
  background:#fff;
  border-radius:22px;
  border:1px solid #eee;
  box-shadow:0 8px 18px rgba(0,0,0,.08);
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease, box-shadow .25s ease;
}
.contract-card:hover{
  transform:translateY(-6px);
  box-shadow:0 14px 32px rgba(0,0,0,.12);
}
.contract-card img{
  max-width:80%;
  max-height:80%;
  object-fit:contain;
  
  transition:.25s;
}
.contract-card:hover img{
  filter:none; opacity:1;
}

/* ===== زر المزيد ===== */
.contracts-center{
  margin-top:38px;
}
.contracts-btn{
  text-decoration:none;
  display:inline-block;
  background:linear-gradient(90deg,#e00441,#b80335);
  color:#fff;
  font-weight:700;
  padding:12px 32px;
  border-radius:14px;
  box-shadow:0 10px 22px rgba(224,4,65,.25);
  transition:.3s;
}
.contracts-btn:hover{
  transform:translateY(-2px);
}



/* ==== Noor Hero + KPIs — LOCKED LAYOUT (Patch) ==== */

/* 1) الهيرو: مساحة سفلية مرنة موحّدة + منع القصّ */
.noor-hero{
  padding-bottom: clamp(56px, 12vw, 82px) !important;
  border-radius: 0 0 36px 36px !important;
  overflow: visible !important;                 /* لو في أجهزة قصّت التداخل */
}

/* 2) الأزرار: نثبّت عمودين دائمًا وبعرض متساوي */
.glassy-buttons{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  max-width: min(600px, 100%) !important;
  margin: 8px auto 0 !important;
}
.glassy-buttons .btn-glass{
  min-height: 40px !important;
  justify-content: center !important;
  flex-direction: row-reverse !important;       /* RTL */
}

/* 3) العدادات: تداخل ثابت محسوب بالـclamp بدل الـmargin السالب العشوائي */
.noor-kpis{
  max-width: 920px !important;
  margin: 0 auto !important;                    /* نشيل أي margins قديمة */
  position: relative !important;
  z-index: 5 !important;

  /* ↓ تداخل ثابت ومتناسب مع الشاشة على كل الأجهزة */
  transform: translateY( calc( clamp(56px, 12vw, 82px) * -0.62 ) ) !important;
  transition: transform .2s ease;
}

/* 4) شبكة العدادات: 3 أعمدة دائمًا (حتى على الشاشات الصغيرة) */
.noor-kpis{ display: grid !important; gap: 14px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

/* 5) الكارت الزجاجي للعدادات: ثبات الظلال والأحجام */
.noor-kpis .kpi{
  padding: 18px 10px !important;
  border-radius: 22px !important;
  box-shadow: 0 12px 28px rgba(224,4,65,.16) !important;
}
.noor-kpis .kpi strong{ direction: ltr !important }

/* 6) أمان إضافي: لو أي تعريف قديم يغيّر الـoverlap تجاهليه */
:root{ --overlap: 0 !important; }
/* منع كسر سطر في نص الأزرار */
.glassy-buttons .btn-glass span{
  white-space: nowrap;      /* أهم سطر */
  text-wrap: nowrap;        /* احتياطي للمتصفحات الجديدة */
  hyphens: none;
}

/* لو الزرين بيتقسموا بالتساوي وده بيضيّق مساحة "جميع الفروع"،
   وسّعي الحد الأدنى لكل زر عشان تفضل كلمة واحدة */
.glassy-buttons{
  grid-template-columns: repeat(2, minmax(164px, 1fr)) !important;
}

/* بديل (لو حابة الزرين على قدّ المحتوى بدون مساواة العرض): */
/*
.glassy-buttons{ grid-template-columns: repeat(2, max-content) !important; }
*/