/* ============================================================
   BANANA PIXELS — أقسام الواجهة والصفحات
   كل الأصناف مسبوقة bp- لتفادي أي تعارض مع الإضافات أو Elementor.
   ============================================================ */

/* ── أدوات عامة ── */
.bp-wrap{max-width:1180px;margin:0 auto;padding:0 1.5rem}
.bp-section{padding:3.25rem 0}
.bp-section.bp-tight{padding-top:0}
.bp-center{text-align:center}

.bp-sh{margin-bottom:1.75rem}
.bp-lab{display:inline-block;background:var(--bp-ink);color:var(--bp-banana);
  font-family:'Press Start 2P',monospace;font-size:9px;padding:6px 11px;margin-bottom:12px;direction:ltr}
.bp-st{font-size:clamp(21px,3.2vw,28px);margin-bottom:6px;font-weight:900;line-height:1.35}
.bp-sd{font-size:15px;color:var(--bp-tx2);max-width:660px;margin:0}
.bp-sh-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap}

.bp-band{background:var(--bp-ink-soft);border-top:var(--bp-px) solid var(--bp-ink);
  border-bottom:var(--bp-px) solid var(--bp-ink)}
.bp-band .bp-st{color:#fff}
.bp-band .bp-sd{color:rgba(255,255,255,.76)}
.bp-band .bp-lab{background:var(--bp-banana);color:var(--bp-ink)}

/* ══════════════════ الهيرو ══════════════════ */
.bp-hero{background:var(--bp-banana);padding:3.5rem 0 3rem;
  border-bottom:var(--bp-px) solid var(--bp-ink);position:relative;overflow:hidden}
.bp-hero::before{content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(11,11,11,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,11,11,.055) 1px,transparent 1px);background-size:16px 16px}
.bp-hero .bp-wrap{position:relative;z-index:1}
.bp-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:2.5rem;align-items:center}
.bp-eyebrow{display:inline-block;background:var(--bp-ink);color:var(--bp-banana);
  padding:7px 13px;font-size:9px;margin-bottom:1.15rem;font-family:'Press Start 2P',monospace;direction:ltr}
.bp-hero h1{font-size:clamp(26px,4.6vw,44px);line-height:1.3;margin-bottom:.85rem;font-weight:900}
.bp-hero-lead{font-size:clamp(15px,2vw,18px);font-weight:700;color:var(--bp-ink);
  margin-bottom:1.5rem;max-width:520px}
.bp-hero-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1.75rem}
.bp-chips{display:flex;gap:.5rem;flex-wrap:wrap}
.bp-chip{background:var(--bp-ink);color:#fff;font-size:12.5px;font-weight:700;padding:6px 12px;display:inline-block}
.bp-chip b{color:var(--bp-banana)}

.bp-hero-card{background:#fff;padding:1.35rem}
.bp-hc-t{font-size:11px;font-weight:900;color:var(--bp-tx3);letter-spacing:.5px;margin-bottom:.85rem}
.bp-hc-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:.6rem 0;border-bottom:1px dashed var(--bp-line)}
.bp-hc-row:last-of-type{border-bottom:none}
.bp-hc-nm{font-size:14px;font-weight:700}
.bp-hc-pr{font-family:'IBM Plex Mono',monospace;font-size:16px;font-weight:600;direction:ltr}
.bp-hc-old{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--bp-tx3);
  text-decoration:line-through;direction:ltr}

/* ══════════════════ شريط الثقة ══════════════════ */
.bp-trust{background:var(--bp-ink);padding:1.15rem 0}
.bp-trust-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.bp-tr{display:flex;align-items:flex-start;gap:.65rem}
.bp-tr-i{font-size:20px;flex-shrink:0;line-height:1.3}
.bp-tr-t{color:#fff;font-size:14px;font-weight:900;line-height:1.4}
.bp-tr-d{color:rgba(255,255,255,.6);font-size:12px;line-height:1.6}

/* ══════════════════ الفئات — شريط متحرك ══════════════════ */
.bp-cat-marq{background:var(--bp-peel);
  border-top:var(--bp-px) solid var(--bp-ink);border-bottom:var(--bp-px) solid var(--bp-ink);
  overflow:hidden;padding:1.35rem 0;position:relative;
  direction:ltr; /* يُرسى المسار من اليسار ليعمل translateX بشكل متوقّع داخل صفحة RTL */
}
.bp-cat-track{display:flex;gap:1rem;width:max-content;
  animation:bp-catscroll 42s linear infinite;will-change:transform}
@keyframes bp-catscroll{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.bp-cat-marq:hover .bp-cat-track,
.bp-cat-marq:focus-within .bp-cat-track{animation-play-state:paused}

.bp-cat{display:flex;align-items:center;gap:.85rem;background:#fff;padding:.9rem 1.2rem;
  min-width:212px;flex-shrink:0;direction:rtl;transition:transform .1s,background .1s;color:var(--bp-ink)}
.bp-cat:hover{background:var(--bp-banana);transform:translateY(-3px);color:var(--bp-ink)}
.bp-cat:focus-visible{outline:3px solid var(--bp-screen);outline-offset:4px}
.bp-cat-i{font-size:27px;line-height:1;flex-shrink:0}
.bp-cat-n{display:block;font-size:14.5px;font-weight:900;line-height:1.35;white-space:nowrap}
.bp-cat-c{display:block;font-size:12px;color:var(--bp-tx3);white-space:nowrap;line-height:1.5}
.bp-cat:hover .bp-cat-c{color:var(--bp-ink)}

@media (prefers-reduced-motion:reduce){
  .bp-cat-marq{overflow-x:auto;padding-inline:1.5rem}
  .bp-cat-track{animation:none;transform:none}
}

/* ══════════════════ خطوات الشراء ══════════════════ */
.bp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.bp-step{background:#fff;padding:1.5rem 1.4rem}
.bp-step-n{width:44px;height:44px;background:var(--bp-banana);border:var(--bp-px) solid var(--bp-ink);
  font-family:'Press Start 2P',monospace;font-size:14px;display:flex;align-items:center;
  justify-content:center;margin-bottom:.9rem}
.bp-step h4{font-size:16.5px;margin-bottom:.35rem;font-weight:900}
.bp-step p{font-size:13.5px;color:var(--bp-tx2);line-height:1.8;margin:0}

/* ══════════════════ لماذا نحن ══════════════════ */
.bp-why{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.bp-wc{background:#fff;padding:1.4rem 1.3rem}
.bp-wc-i{font-size:26px;display:block;margin-bottom:.5rem}
.bp-wc h4{font-size:15.5px;margin-bottom:.35rem;font-weight:900}
.bp-wc p{font-size:13px;color:var(--bp-tx2);line-height:1.75;margin:0}

/* ══════════════════ آراء العملاء ══════════════════ */
.bp-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.bp-rev{background:#fff;padding:1.35rem 1.4rem}
.bp-rev-stars{color:var(--bp-banana-dp);font-size:15px;letter-spacing:2px;margin-bottom:.5rem}
.bp-rev p{font-size:14px;color:var(--bp-tx2);line-height:1.85;margin-bottom:.85rem}
.bp-rev-who{display:flex;align-items:center;gap:.6rem}
.bp-rev-av{width:34px;height:34px;background:var(--bp-banana);border:3px solid var(--bp-ink);
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;flex-shrink:0}
.bp-rev-n{font-size:13.5px;font-weight:900;line-height:1.3}
.bp-rev-d{font-size:11.5px;color:var(--bp-tx3)}

/* ══════════════════ الأسئلة الشائعة ══════════════════ */
.bp-faq{max-width:820px;margin:0 auto}
.bp-fq{background:#fff;margin-bottom:.75rem}
.bp-fq summary{padding:1rem 1.2rem;font-size:15px;font-weight:900;cursor:pointer;list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:1rem}
.bp-fq summary::-webkit-details-marker{display:none}
.bp-fq summary::after{content:'+';font-family:'IBM Plex Mono',monospace;font-size:20px;
  font-weight:600;flex-shrink:0}
.bp-fq[open] summary::after{content:'\2212'}
.bp-fq[open] summary{background:var(--bp-peel)}
.bp-fq-a{padding:1rem 1.2rem;font-size:14px;color:var(--bp-tx2);line-height:1.9;
  border-top:2px dashed var(--bp-line)}
.bp-fq-a p:last-child{margin-bottom:0}
.bp-faq h3{font-size:18px;margin:2rem 0 .85rem;font-weight:900}
.bp-faq h3:first-child{margin-top:0}

/* ══════════════════ نداء ══════════════════ */
.bp-cta{background:var(--bp-banana);border-top:var(--bp-px) solid var(--bp-ink);
  border-bottom:var(--bp-px) solid var(--bp-ink);padding:2.75rem 0;text-align:center;
  position:relative;overflow:hidden}
.bp-cta::before{content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(11,11,11,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,11,11,.055) 1px,transparent 1px);background-size:16px 16px}
.bp-cta .bp-wrap{position:relative;z-index:1}
.bp-cta h2{font-size:clamp(21px,3.2vw,30px);margin-bottom:.5rem;font-weight:900}
.bp-cta p{font-size:15.5px;font-weight:700;margin-bottom:1.35rem}

/* ══════════════════ الفوتر ══════════════════ */
.bp-footer{background:var(--bp-ink);color:rgba(255,255,255,.66);
  border-top:var(--bp-px) solid var(--bp-banana);padding:2.75rem 0 1.5rem}
.bp-footer-g{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:2rem;margin-bottom:1.75rem}
.bp-footer-brand{font-family:'Press Start 2P',monospace;font-size:13px;color:var(--bp-banana);
  margin-bottom:.75rem;direction:ltr}
.bp-footer h4{color:#fff;font-size:14px;margin-bottom:.85rem;font-weight:900}
.bp-footer ul{list-style:none;margin:0;padding:0}
.bp-footer li{margin-bottom:.45rem}
.bp-footer a,.bp-footer p{font-size:13.5px;color:rgba(255,255,255,.66);line-height:1.8}
.bp-footer a:hover{color:var(--bp-banana)}
.bp-pay{display:flex;gap:6px;flex-wrap:wrap;margin-top:.6rem}
.bp-pay span{background:#fff;color:var(--bp-ink);font-size:10.5px;font-weight:900;
  padding:4px 8px;border:2px solid var(--bp-ink)}
.bp-footer-b{border-top:1px solid rgba(255,255,255,.13);padding-top:1.15rem;display:flex;
  justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:12.5px}

/* ══════════════════ فتات الخبز ══════════════════ */
.bp-crumb{font-size:13px;color:var(--bp-tx3);padding:1.15rem 0}
.bp-crumb a:hover{color:var(--bp-ink);text-decoration:underline}

/* ══════════════════ صفحات المحتوى ══════════════════ */
.bp-page-title{font-size:clamp(24px,4vw,36px);margin-bottom:1.5rem;font-weight:900}
.bp-content{max-width:820px;margin:0 auto}
.bp-content a,.bp-doc a{color:var(--bp-banana-dp);text-decoration:underline}
.bp-posts article h2 a:hover{color:var(--bp-banana-dp)}
.bp-doc{max-width:820px;margin:0 auto}
.bp-doc h2{font-size:22px;margin:2rem 0 .6rem;font-weight:900}
.bp-doc h2:first-child{margin-top:0}
.bp-doc h3{font-size:17px;margin:1.35rem 0 .4rem;font-weight:900}
.bp-doc p{font-size:15px;color:var(--bp-tx2);line-height:1.95;margin-bottom:.85rem}
.bp-doc ul,.bp-doc ol{margin:.5rem 2rem 1rem;color:var(--bp-tx2);font-size:15px;line-height:1.95}
.bp-doc li{margin-bottom:.4rem}
.bp-note{background:var(--bp-peel);padding:.9rem 1.1rem;font-size:14px;margin:1rem 0;
  color:var(--bp-ink);border-right:var(--bp-px) solid var(--bp-banana-dp)}

/* ══════════════════ إحصاءات ══════════════════ */
.bp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.15rem}
.bp-stat{background:var(--bp-ink);color:#fff;padding:1.35rem 1.2rem;text-align:center}
.bp-stat-v{font-family:'IBM Plex Mono',monospace;font-size:30px;font-weight:600;
  color:var(--bp-banana);direction:ltr;line-height:1.2}
.bp-stat-l{font-size:12.5px;color:rgba(255,255,255,.7);margin-top:.25rem}

/* ══════════════════ قنوات التواصل ══════════════════ */
.bp-chan{background:#fff;padding:1.2rem 1.3rem;margin-bottom:1rem;display:flex;
  gap:.9rem;align-items:flex-start}
.bp-chan-i{font-size:24px;flex-shrink:0}
.bp-chan h4{font-size:15px;margin-bottom:.2rem;font-weight:900}
.bp-chan p{font-size:13.5px;color:var(--bp-tx2);line-height:1.75;margin:0}
.bp-cols-2{display:grid;grid-template-columns:1fr .8fr;gap:1.75rem;align-items:start}

/* ══════════════════ زر واتساب عائم ══════════════════ */
.bp-wa{position:fixed;bottom:20px;left:20px;z-index:700;background:#25D366;
  width:56px;height:56px;display:flex;align-items:center;justify-content:center;
  border:var(--bp-px) solid var(--bp-ink);
  box-shadow:var(--bp-px) var(--bp-px) 0 var(--bp-px) rgba(11,11,11,.2);transition:transform .08s}
.bp-wa:hover{transform:translate(2px,2px)}
.bp-wa svg{width:28px;height:28px;fill:var(--bp-ink)}

/* ══════════════════ الاستجابة ══════════════════ */
@media(max-width:1024px){
  .bp-why{grid-template-columns:repeat(2,1fr)}
  .bp-footer-g{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .bp-hero-grid,.bp-cols-2{grid-template-columns:1fr}
  .bp-trust-g,.bp-steps,.bp-revs,.bp-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .bp-trust-g,.bp-steps,.bp-revs,.bp-why,.bp-stats,.bp-footer-g{grid-template-columns:1fr}
  .bp-cat{min-width:0}
  .bp-cat-track{animation-duration:30s}
  .bp-wa{width:50px;height:50px;bottom:14px;left:14px}
}