/* ═══════════════════════════════════════════════════════
 *  solutions-logistics.css — أُستخرِج آليًا من pages/solutions/logistics.php
 *  المقطع 1 من 1 · سطور 11–11 في الأصل.
 *  ⚠️ الترتيب بين المقاطع مقصود: بينها كتل <style> مشروطة
 *     باقية في الصفحة، والتتالي يعتمد على تسلسلها.
 * ═══════════════════════════════════════════════════════ */
.solLog{--pb:#2563EB;--pb2:#1e3fae;--nv:#0D1B3E;--ink:#1f2937;--mut:#6b7480;--faint:#6b7280;--l1:#60A5FA;--l2:#93C5FD;--l3:#DBEAFE;--line:#e8ebf1;--soft:#f6f8fc;--soft2:#eef4ff;color-scheme:light}
.solLog{color:var(--ink);line-height:1.9;font-family:'Segoe UI','Segoe UI Arabic',Tahoma,Arial,sans-serif;background:#fff;overflow-x:clip}
.solLog .w{max-width:1160px;margin:0 auto;padding:0 24px}
.solLog section{padding:74px 0}
.solLog .svic{width:1em;height:1em;display:inline-block;vertical-align:-.13em;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.solLog .eyebrow{display:inline-flex;align-items:center;gap:9px;background:var(--soft2);color:var(--pb);font-weight:800;font-size:.78rem;padding:8px 16px;border-radius:999px;border:1px solid #dbe6ff;margin-bottom:18px}
.solLog .eyebrow .svic{font-size:.95rem}
.solLog h1{font-size:clamp(2rem,4.4vw,3.1rem);font-weight:900;color:var(--nv);letter-spacing:-.02em;line-height:1.3;margin:0 0 18px}
.solLog h2{font-size:clamp(1.5rem,3vw,2.15rem);font-weight:800;color:var(--nv);letter-spacing:-.5px;line-height:1.44;margin:0 0 12px}
.solLog .g{background:linear-gradient(115deg,var(--pb),#5c85ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.solLog .lead{font-size:1.05rem;color:var(--mut);line-height:2}
.solLog .cta{display:inline-flex;align-items:center;gap:9px;background:var(--pb);color:#fff;font-weight:800;font-size:.95rem;padding:15px 30px;border-radius:14px;text-decoration:none;box-shadow:0 10px 26px rgba(37,99,235,.3);transition:.2s}
.solLog .cta:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(37,99,235,.4)}
.solLog .cta .svic{font-size:1rem}
.solLog .cta2{display:inline-flex;align-items:center;gap:8px;color:var(--nv);font-weight:800;font-size:.92rem;padding:15px 24px;text-decoration:none;border-radius:14px;border:1px solid var(--line);transition:.2s;background:#fff}
.solLog .cta2:hover{border-color:#c9d6f2;background:var(--soft2)}
.solLog .rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.solLog .rv.in{opacity:1;transform:none}

/* ═══════════ الهيرو ═══════════ */
.solLog .hero{position:relative;padding:78px 0 82px;background:linear-gradient(180deg,#fff 0%,#F3F7FF 66%,#fff)}
.solLog .hero .aur{position:absolute;border-radius:50%;filter:blur(92px);opacity:.55;pointer-events:none}
.solLog .hero .a1{width:520px;height:520px;background:radial-gradient(circle,#c6dbff,transparent 65%);top:-180px;right:-130px}
.solLog .hero .a2{width:440px;height:440px;background:radial-gradient(circle,#dbe6ff,transparent 65%);bottom:-170px;left:-110px}
.solLog .hero .w{position:relative;display:grid;grid-template-columns:1fr 1.08fr;gap:50px;align-items:center}
.solLog .hero .lead{max-width:540px;margin-bottom:28px}
.solLog .hero .btns{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.solLog .trustline{display:flex;gap:22px;margin-top:30px;flex-wrap:wrap}
.solLog .trustline span{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700;color:var(--mut)}
.solLog .trustline .svic{color:var(--pb);font-size:.95rem}

/* ═══════════ لوحة خريطة التوصيل ═══════════ */
.solLog .hviz{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 34px 82px rgba(13,27,62,.16);padding:20px 18px 18px;overflow:hidden}
.solLog .hviz .cbar{display:flex;align-items:center;gap:6px;margin-bottom:14px;padding:0 4px}
.solLog .hviz .cbar i{width:9px;height:9px;border-radius:50%}
.solLog .hviz .cbar i:nth-child(1){background:#f2b4b4}.solLog .hviz .cbar i:nth-child(2){background:#f4d69a}.solLog .hviz .cbar i:nth-child(3){background:#a9d9c0}
.solLog .hviz .cbar span{margin-inline-start:9px;font-size:.7rem;color:var(--faint);font-weight:800;letter-spacing:.2px}
.solLog .hviz .cbar em{margin-inline-start:auto;font-style:normal;font-size:.66rem;font-weight:800;color:var(--pb);background:var(--soft2);border:1px solid #dbe6ff;border-radius:999px;padding:4px 11px;display:inline-flex;align-items:center;gap:6px}
.solLog .hviz .cbar em b{width:7px;height:7px;border-radius:50%;background:var(--pb);display:inline-block;animation:solLive 1.6s ease-in-out infinite}
@keyframes solLive{50%{opacity:.35}}
.solLog .mapwrap{position:relative;aspect-ratio:460/250;background:radial-gradient(rgba(37,99,235,.055) 1px,transparent 1px);background-size:20px 20px;background-color:var(--soft);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.solLog .mapsvg{position:absolute;inset:0;width:100%;height:100%}
.solLog .rbase{fill:none;stroke:var(--l3);stroke-width:5;stroke-linecap:round}
.solLog .rdash{fill:none;stroke:#c9dcff;stroke-width:5;stroke-linecap:round;stroke-dasharray:1 12}
.solLog .rprog{fill:none;stroke:url(#solGrad);stroke-width:5;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:solDraw 7s linear infinite}
@keyframes solDraw{0%{stroke-dashoffset:100}92%,100%{stroke-dashoffset:0}}
.solLog .truck path,.solLog .truck rect,.solLog .truck circle{fill:#fff;stroke:var(--pb);stroke-width:1.5;vector-effect:non-scaling-stroke}
.solLog .truck .cab{fill:var(--pb)}
.solLog .pin{position:absolute;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none}
.solLog .pin .pdot{width:30px;height:30px;border-radius:50%;background:#fff;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--faint);box-shadow:0 6px 16px rgba(13,27,62,.1);transition:.3s}
.solLog .pin .pdot .svic{font-size:.9rem}
.solLog .pin b{font-size:.6rem;font-weight:800;color:var(--nv);background:#fff;border:1px solid var(--line);border-radius:999px;padding:2px 9px;white-space:nowrap;box-shadow:0 4px 10px rgba(13,27,62,.06)}
.solLog .pin.pin1{left:92%;top:82%}
.solLog .pin.pin2{left:54%;top:59%}
.solLog .pin.pin3{left:14%;top:26%}
.solLog .pin.on .pdot{border-color:var(--pb);color:var(--pb);background:var(--soft2)}
.solLog .mapwrap.play .pin1 .pdot,.solLog .mapwrap.play .pin2 .pdot,.solLog .mapwrap.play .pin3 .pdot{animation:solPdot 7s linear infinite}
.solLog .mapwrap.play .pin2 .pdot{animation-delay:2.4s}
.solLog .mapwrap.play .pin3 .pdot{animation-delay:5s}
@keyframes solPdot{0%,3%{border-color:var(--line);color:var(--faint);background:#fff;transform:scale(1)}7%{border-color:var(--pb);color:var(--pb);background:var(--soft2);transform:scale(1.18)}12%,96%{border-color:var(--pb);color:var(--pb);background:var(--soft2);transform:scale(1)}100%{border-color:var(--line);color:var(--faint);background:#fff;transform:scale(1)}}
/* شريط توقيع القاعدة */
.solLog .sigstrip{margin-top:14px;background:var(--soft2);border:1px solid #dbe6ff;border-radius:14px;padding:14px 16px}
.solLog .sigstrip .ssr{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.solLog .sigstrip .ssr span{font-size:.78rem;font-weight:800;color:var(--nv);display:inline-flex;align-items:center;gap:7px}
.solLog .sigstrip .ssr span .svic{color:var(--pb);font-size:.95rem}
.solLog .sigstrip .ssr em{font-style:normal;font-size:.74rem;font-weight:800;color:var(--pb)}
.solLog .bar{height:9px;border-radius:6px;background:#fff;border:1px solid #d4e2ff;overflow:hidden}
.solLog .bar i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,var(--l1),var(--pb))}
.solLog .mapwrap.play + .sigstrip .bar i,.solLog .hviz.play .bar i{animation:solFill 7s cubic-bezier(.3,.8,.3,1) infinite}
@keyframes solFill{0%{width:6%}86%,100%{width:94%}}
.solLog .sstags{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.solLog .sstags span{font-size:.64rem;font-weight:800;color:var(--pb);background:#fff;border:1px solid #d4e2ff;border-radius:999px;padding:4px 11px;display:inline-flex;align-items:center;gap:6px}
.solLog .sstags span .svic{font-size:.78rem}

/* ═══════════ التحدّي ═══════════ */
.solLog .chal .whead{max-width:760px;margin:0 auto 40px;text-align:center}
.solLog .chal .whead .lead{max-width:720px;margin:12px auto 0}
.solLog .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.solLog .pain{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 24px;transition:.3s;position:relative;overflow:hidden}
.solLog .pain::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;background:linear-gradient(90deg,var(--l2),var(--pb))}
.solLog .pain:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(13,27,62,.1);border-color:#dbe6ff}
.solLog .pain .ic{width:48px;height:48px;border-radius:14px;background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:16px}
.solLog .pain h3{font-size:1.04rem;font-weight:800;color:var(--nv);margin:0 0 8px}
.solLog .pain p{font-size:.86rem;color:var(--mut);margin:0;line-height:1.95}

/* ═══════════ كيف يحلّها ═══════════ */
.solLog .solve{background:linear-gradient(180deg,#fff,#F3F7FF 55%,#fff)}
.solLog .solve .whead{text-align:center;max-width:720px;margin:0 auto 42px}
.solLog .fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.solLog .fcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;transition:.3s}
.solLog .fcard:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(13,27,62,.1);border-color:#dbe6ff}
.solLog .fcard .ic{width:48px;height:48px;border-radius:14px;background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:16px}
.solLog .fcard h3{font-size:1.02rem;font-weight:800;color:var(--nv);margin:0 0 8px}
.solLog .fcard p{font-size:.85rem;color:var(--mut);margin:0;line-height:1.95}
.solLog .fcard .tag{display:inline-block;margin-top:12px;font-size:.64rem;font-weight:800;color:var(--pb);background:var(--soft2);border:1px solid #dbe6ff;border-radius:999px;padding:4px 11px}

/* ═══════════ شريط الأرقام ═══════════ */
.solLog .nums{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--soft)}
.solLog .nums .w{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;text-align:center;padding-top:36px;padding-bottom:36px}
.solLog .num .ic{width:44px;height:44px;border-radius:13px;background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:1.05rem;margin:0 auto 12px}
.solLog .num b{display:block;font-size:1.7rem;font-weight:900;color:var(--nv);letter-spacing:-.5px;line-height:1.1;margin-bottom:6px}
.solLog .num b em{font-style:normal;color:var(--pb)}
.solLog .num span{font-size:.8rem;color:var(--mut);font-weight:600}

/* ═══════════ الرحلة ═══════════ */
.solLog .jrn .whead{text-align:center;max-width:680px;margin:0 auto 42px}
.solLog .grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.solLog .step{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 22px;transition:.3s}
.solLog .step:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(13,27,62,.09)}
.solLog .step .sn{width:44px;height:44px;border-radius:14px;background:var(--pb);color:#fff;font-weight:900;font-size:1.05rem;display:flex;align-items:center;justify-content:center;margin-bottom:14px;box-shadow:0 8px 22px rgba(37,99,235,.3)}
.solLog .step h3{font-size:.98rem;font-weight:800;color:var(--nv);margin:0 0 6px}
.solLog .step p{font-size:.82rem;color:var(--mut);margin:0;line-height:1.9}
.solLog .step .ar{position:absolute;top:46px;left:-13px;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:.7rem;z-index:3}
.solLog .step .ar .svic{font-size:.8rem}

/* ═══════════ لماذا ═══════════ */
.solLog .why{background:linear-gradient(180deg,#fff,#F3F7FF 55%,#fff)}
.solLog .why .whead{text-align:center;max-width:740px;margin:0 auto 42px}
.solLog .wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.solLog .wcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;transition:.3s;display:flex;flex-direction:column;gap:6px}
.solLog .wcard:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(13,27,62,.1);border-color:#dbe6ff}
.solLog .wcard .ic{width:46px;height:46px;border-radius:14px;background:var(--soft2);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:1.15rem;margin-bottom:10px}
.solLog .wcard h3{font-size:1.0rem;font-weight:800;color:var(--nv);margin:0}
.solLog .wcard p{font-size:.85rem;color:var(--mut);margin:0;line-height:1.95}

/* ═══════════ الأسئلة ═══════════ */
.solLog .faqsec .whead{text-align:center;max-width:660px;margin:0 auto 38px}
.solLog .faq{max-width:820px;margin:0 auto}
.solLog .qa{border:1px solid var(--line);border-radius:15px;background:#fff;margin-bottom:12px;overflow:hidden;transition:.3s}
.solLog .qa .qh{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 22px;cursor:pointer;font-weight:800;font-size:.95rem;color:var(--nv)}
.solLog .qa .qh .x{width:26px;height:26px;border-radius:9px;background:var(--soft);color:var(--pb);display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:.3s;flex:0 0 auto}
.solLog .qa .qb{max-height:0;overflow:hidden;transition:max-height .4s ease;padding:0 22px}
.solLog .qa .qb p{font-size:.86rem;color:var(--mut);line-height:2;margin:0 0 18px}
.solLog .qa.open{border-color:#dbe6ff;box-shadow:0 12px 30px rgba(13,27,62,.06)}
.solLog .qa.open .qh .x{transform:rotate(45deg);background:var(--pb);color:#fff}
.solLog .qa.open .qb{max-height:320px}

/* ═══════════ CTA النهائي ═══════════ */
.solLog .fin{padding:0}
.solLog .fin .box{position:relative;text-align:center;background:linear-gradient(120deg,#2563EB,#1e3fae);color:#fff;border-radius:30px;margin:0 24px 74px;padding:70px 30px;overflow:hidden}
.solLog .fin .box::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 8%,rgba(255,255,255,.16),transparent 55%),radial-gradient(circle at 12% 92%,rgba(255,255,255,.1),transparent 50%)}
.solLog .fin .box>*{position:relative}
.solLog .fin h2{color:#fff;margin-bottom:12px}
.solLog .fin .lead{color:#dbe6ff;max-width:620px;margin:0 auto 30px}
.solLog .fin .btns{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:center}
.solLog .fin .cta{background:#fff;color:var(--pb);box-shadow:0 12px 30px rgba(0,0,0,.2)}
.solLog .fin .cta:hover{box-shadow:0 16px 38px rgba(0,0,0,.28)}
.solLog .fin .cta2{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.solLog .fin .cta2:hover{background:rgba(255,255,255,.12);border-color:#fff}

@media(max-width:980px){
  .solLog .hero .w{grid-template-columns:1fr;gap:44px}
  .solLog .grid3,.solLog .fgrid,.solLog .wgrid,.solLog .nums .w,.solLog .grid4{grid-template-columns:1fr 1fr}
  .solLog .step .ar{display:none}
}
@media(max-width:680px){
  .solLog section{padding:54px 0}
  .solLog .grid3,.solLog .fgrid,.solLog .wgrid,.solLog .grid4{grid-template-columns:1fr}
  .solLog .nums .w{grid-template-columns:1fr 1fr}
  .solLog .fin .box{margin:0 14px 54px;border-radius:22px;padding:54px 22px}
}
