:root{
  --navy:#052B55; --navy-2:#0A3A6E; --navy-3:#0E4580; --royal:#075EA8; --teal:#08A7C6; --gold:#D6A53A;
  --white:#FFFFFF; --bg:#F5FAFD; --surface:#FFFFFF; --tint:#EAF3FA;
  --ink:#0B1F36; --ink-2:#3B5270; --muted:#6A7E97; --line:#D9E5EF; --line-2:#EBF2F8;
  --good:#17865A; --good-bg:#E4F5EC; --warn:#B7790C; --warn-bg:#FBF1DC; --bad:#BF3B35; --bad-bg:#FBE7E5; --info-bg:#E3F4F8;
  --r-sm:8px; --r:14px; --r-lg:20px;
  --sh:0 1px 2px rgba(5,43,85,.05),0 6px 20px -8px rgba(5,43,85,.12);
  --sh-lg:0 2px 4px rgba(5,43,85,.05),0 24px 48px -20px rgba(5,43,85,.28);
  --f-ar:"Cairo",system-ui,"Segoe UI",Tahoma,sans-serif;
  --f-body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --f-disp:"Sora","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --hdr:72px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
html[lang="ar"] body{font-family:var(--f-ar);font-size:15.5px;line-height:1.75}
h1,h2,h3,h4{font-family:var(--f-disp);color:var(--navy);line-height:1.2;margin:0;text-wrap:balance;letter-spacing:-.015em}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4{font-family:var(--f-ar);letter-spacing:0;line-height:1.35;font-weight:800}
p{margin:0}
a{color:var(--royal);text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
.mono{font-family:var(--f-mono);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.num{font-variant-numeric:tabular-nums}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:20px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--royal)}
html[lang="ar"] .eyebrow{letter-spacing:0;font-size:14px;font-weight:700}
.eyebrow::before{content:"";width:18px;height:2px;background:var(--gold);border-radius:2px}
.sec{padding-block:88px}
.sec-sm{padding-block:56px}
.sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px 40px;margin-bottom:40px}
.sec-head h2{font-size:clamp(28px,3.4vw,42px);margin-top:10px}
.sec-head p{color:var(--ink-2);max-width:56ch;margin-top:12px}
.lead{font-size:17px;color:var(--ink-2)}
.flip{transition:transform .2s}
html[dir="rtl"] .flip{transform:scaleX(-1)}
svg.i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
svg.i.sm{width:17px;height:17px}
svg.i.lg{width:30px;height:30px;stroke-width:1.4}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:46px;padding-inline:20px;border-radius:12px;border:1px solid transparent;font-weight:600;font-size:15px;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,border-color .2s,transform .15s,box-shadow .2s;text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--royal);color:#fff}
.btn-primary:hover{background:var(--navy-3)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#c99530}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--navy)}
.btn-ghost:hover{border-color:var(--royal);color:var(--royal)}
.btn-light{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff}
.btn-light:hover{background:rgba(255,255,255,.16)}
.btn-wa{background:#1E9E57;color:#fff}
.btn-wa:hover{background:#178449}
.btn-sm{height:36px;padding-inline:14px;font-size:13.5px;border-radius:10px}
.btn-block{width:100%}
.link-arrow{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--royal)}
.link-arrow:hover{gap:10px}
.link-arrow{transition:gap .2s}

/* header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line-2)}
.hdr-in{height:var(--hdr);display:flex;align-items:center;gap:14px;min-width:0}
.logo{display:flex;align-items:center;gap:10px;color:var(--navy);flex:none}
.logo-mark{width:52px;height:52px;flex:none;border-radius:50%;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(5,43,85,.22))}
.ftr .logo-mark{width:64px;height:64px}
.logo-t{display:flex;flex-direction:column;line-height:1}
.logo-t b{font-family:var(--f-disp);font-size:15.5px;letter-spacing:.07em;font-weight:700;white-space:nowrap}
.logo-t small{font-size:9px;letter-spacing:.18em;color:var(--muted);margin-top:4px;font-family:var(--f-body);font-weight:500}
.nav{display:flex;align-items:center;gap:2px;margin-inline-start:12px}
.nav a{padding:8px 11px;border-radius:9px;color:var(--ink-2);font-weight:500;font-size:14.5px;white-space:nowrap}
html[lang="ar"] .nav a{font-size:15px;font-weight:600}
.nav a:hover{color:var(--navy);background:var(--tint)}
.nav a.on{color:var(--navy);font-weight:700}
.nav a.on::after{content:"";display:block;height:2px;background:var(--gold);border-radius:2px;margin-top:2px}
.hdr-act{display:flex;align-items:center;gap:8px;margin-inline-start:auto}
.lang{display:flex;background:var(--tint);border-radius:10px;padding:3px;border:1px solid var(--line)}
.lang button{border:0;background:transparent;padding:6px 10px;border-radius:8px;font-size:13px;font-weight:700;color:var(--ink-2);cursor:pointer;min-width:38px}
.lang button.on{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(5,43,85,.15)}
.icon-btn{width:42px;height:42px;display:inline-grid;place-items:center;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--navy);cursor:pointer}
.burger{display:none}
.acct{display:inline-flex}
.hdr-act .btn-ghost{display:inline-flex}
.nav a{padding:8px 7px;font-size:13.5px}html[lang="ar"] .nav a{font-size:14px}.nav{margin-inline-start:4px}
@media (max-width:1600px){.nav{display:none}.burger{display:inline-grid}}
@media (max-width:640px){.hdr-act .btn,.acct{display:none}.logo-t small{display:none}.logo-t b{font-size:13px;letter-spacing:.03em}.logo-mark{width:44px;height:44px}.hdr-in{gap:10px}}
@media (max-width:370px){.logo-t b{font-size:11.5px;letter-spacing:0}.hdr-in{gap:6px}.logo{gap:7px}.lang button{min-width:32px;padding:6px 7px}}

.drawer{position:fixed;inset:0;z-index:80;display:none}
.drawer.open{display:block}
.drawer-bg{position:absolute;inset:0;background:rgba(5,43,85,.45)}
.drawer-p{position:absolute;inset-block:0;inset-inline-end:0;width:min(340px,88vw);background:#fff;padding:calc(20px + env(safe-area-inset-top,0px)) 20px 24px;display:flex;flex-direction:column;gap:4px;overflow:auto;animation:slideIn .25s ease}
@keyframes slideIn{from{transform:translateX(12%);opacity:.6}}
.drawer-p a.dl{padding:13px 12px;border-radius:10px;color:var(--navy);font-weight:600;font-size:16px;border-bottom:1px solid var(--line-2)}
.drawer-p a.dl:hover{background:var(--tint)}

/* mobile action bar */
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;inset-inline:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px))}
  .mbar .btn{height:46px}
  body{padding-bottom:76px}
  .wa-float{bottom:calc(88px + env(safe-area-inset-bottom,0px))!important}
}
.wa-float{position:fixed;z-index:61;inset-inline-end:20px;bottom:calc(24px + env(safe-area-inset-bottom,0px));height:54px;padding-inline:16px 18px;border-radius:30px;background:#1E9E57;color:#fff;display:flex;align-items:center;gap:9px;font-weight:700;box-shadow:0 10px 26px -8px rgba(23,110,63,.6);transition:transform .2s}
.wa-float:hover{transform:translateY(-2px)}
.wa-float span{font-size:14px}
@media (max-width:760px){.wa-float{width:54px;padding:0;justify-content:center}.wa-float span{display:none}}

/* page transition */
#app{animation:pageIn .45s cubic-bezier(.2,.7,.2,1)}
@keyframes pageIn{from{opacity:.4;transform:translateY(8px)}}

/* hero */
.hero{position:relative;background:var(--navy);color:#fff;overflow:hidden;isolation:isolate}
.hero-map{position:absolute;inset:0;z-index:-2}
.hero-map svg{position:absolute;width:118%;height:auto;top:6%;inset-inline-start:-4%;opacity:1}
html[dir="rtl"] .hero-map svg{inset-inline-start:auto;left:-14%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(900px 420px at 80% 30%,rgba(8,167,198,.16),transparent 70%),
  linear-gradient(90deg,rgba(5,43,85,.97) 0%,rgba(5,43,85,.86) 40%,rgba(5,43,85,.35) 72%,rgba(5,43,85,.15) 100%)}
html[dir="rtl"] .hero::before{background:
  radial-gradient(900px 420px at 20% 30%,rgba(8,167,198,.16),transparent 70%),
  linear-gradient(270deg,rgba(5,43,85,.97) 0%,rgba(5,43,85,.86) 40%,rgba(5,43,85,.35) 72%,rgba(5,43,85,.15) 100%)}
.hero-in{position:relative;padding-block:84px 150px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px}
.hero h1{color:#fff;font-size:clamp(38px,5.6vw,72px);line-height:1.04;letter-spacing:-.03em;max-width:13ch}
html[lang="ar"] .hero h1{line-height:1.25;letter-spacing:0;font-size:clamp(40px,5.6vw,70px);max-width:12ch}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero .lead{color:#C7D8EA;max-width:48ch;margin-top:22px;font-size:18px}
.hero .eyebrow{color:var(--teal)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero-modes{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:40px;color:#A9C1DA;font-size:13.5px}
.hero-modes span{display:inline-flex;align-items:center;gap:8px}
.hero-modes b{color:#fff;font-weight:600}
.hero-side{align-self:end;display:flex;flex-direction:column;gap:10px;justify-self:end;width:min(100%,340px)}
.lane{display:flex;align-items:center;gap:12px;background:rgba(5,43,85,.6);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:14px;padding:12px 14px;font-size:13.5px;color:#D3E1EF}
.lane .ln{flex:1;display:flex;align-items:center;gap:8px;font-weight:600;color:#fff}
.lane .ln i{flex:1;height:1px;border-top:1px dashed rgba(214,165,58,.7);min-width:14px}
.lane small{color:#8FB0CF;font-size:12px}
.port-sil{position:absolute;inset-inline:0;bottom:0;height:120px;z-index:-1;pointer-events:none}
.port-sil svg{width:100%;height:100%}
@media (max-width:900px){.hero-in{grid-template-columns:1fr;padding-block:56px 140px}.hero-side{display:none}.hero-map svg{width:200%;top:auto;bottom:40px;inset-inline-start:-60%;opacity:.8}html[dir="rtl"] .hero-map svg{left:-40%}
 .hero::before{background:linear-gradient(180deg,rgba(5,43,85,.96) 0%,rgba(5,43,85,.8) 55%,rgba(5,43,85,.5) 100%)!important}}

/* track box */
.trackbox{position:relative;z-index:5;margin-top:-92px}
.tcard{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:26px;border:1px solid var(--line-2)}
.tcard-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.tcard-h h3{font-size:20px;display:flex;align-items:center;gap:10px}
.tcard-h h3 svg{color:var(--teal)}
.tform{display:flex;gap:10px}
.tform .field{flex:1}
.samples{font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip-s{border:1px dashed var(--line);background:var(--bg);border-radius:8px;padding:2px 8px;cursor:pointer;color:var(--navy);font-family:var(--f-mono);font-size:12.5px}
.chip-s:hover{border-color:var(--teal)}
@media (max-width:560px){.tform{flex-direction:column}.tcard{padding:18px}}

/* fields */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-size:13px;font-weight:600;color:var(--ink-2)}
.field label .req{color:var(--bad)}
.inp{height:48px;border:1px solid var(--line);background:#fff;border-radius:11px;padding-inline:14px;width:100%;min-width:0;transition:border-color .2s,box-shadow .2s;font-size:15px}
textarea.inp{height:auto;min-height:110px;padding-block:12px;resize:vertical}
select.inp{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%236A7E97' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-inline-end:36px}
html[dir="rtl"] select.inp{background-position:left 14px center}
.inp:hover{border-color:#BFD2E3}
.inp:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(8,167,198,.14)}
.inp.lg{height:56px;font-size:17px}
.inp.mono{font-family:var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.inp.mono::placeholder{text-transform:none;letter-spacing:0;font-family:var(--f-body)}
html[lang="ar"] .inp.mono::placeholder{font-family:var(--f-ar)}
.inp.err{border-color:var(--bad)}
.hint{font-size:12.5px;color:var(--muted)}
.grid-f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grid-f .full{grid-column:1/-1}
.grid-f3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:640px){.grid-f,.grid-f3{grid-template-columns:1fr}}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{display:inline-flex;align-items:center;gap:8px;height:46px;padding-inline:16px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer;font-weight:600;font-size:14.5px;color:var(--ink-2);transition:all .15s}
.seg input:checked+label{border-color:var(--royal);background:#EEF5FC;color:var(--navy);box-shadow:inset 0 0 0 1px var(--royal)}
.seg input:focus-visible+label{outline:2px solid var(--teal);outline-offset:2px}
.drop{border:1.5px dashed #BCD0E2;border-radius:14px;padding:22px;text-align:center;background:var(--bg);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink-2);transition:border-color .2s,background .2s}
.drop:hover,.drop.over{border-color:var(--teal);background:var(--info-bg)}
.drop svg{color:var(--royal)}
.files{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.file{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13.5px}
.file .fx{margin-inline-start:auto;border:0;background:none;color:var(--muted);cursor:pointer;font-size:18px;line-height:1}
.file .ft{font-family:var(--f-mono);font-size:11px;background:var(--tint);color:var(--royal);border-radius:5px;padding:1px 6px}

/* timeline horizontal */
.tl-h{position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:0;margin-top:8px}
.tl-h .st{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding-inline:4px}
.tl-h .st::before{content:"";position:absolute;top:15px;inset-inline-start:-50%;width:100%;height:3px;background:var(--line);z-index:0}
.tl-h .st:first-child::before{display:none}
.tl-h .st.done::before,.tl-h .st.cur::before{background:linear-gradient(90deg,var(--royal),var(--teal))}
html[dir="rtl"] .tl-h .st.done::before,html[dir="rtl"] .tl-h .st.cur::before{background:linear-gradient(270deg,var(--royal),var(--teal))}
.tl-h .dot{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;background:#fff;border:2px solid var(--line);display:grid;place-items:center;color:var(--muted)}
.tl-h .done .dot{background:var(--royal);border-color:var(--royal);color:#fff}
.tl-h .cur .dot{background:#fff;border-color:var(--teal);color:var(--teal);box-shadow:0 0 0 6px rgba(8,167,198,.16)}
.tl-h .cur .dot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--teal);opacity:.5;animation:ping 2s ease-out infinite}
@keyframes ping{from{transform:scale(.8);opacity:.6}to{transform:scale(1.35);opacity:0}}
.tl-h .lbl{font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.35}
.tl-h .done .lbl{color:var(--ink-2)}
.tl-h .cur .lbl{color:var(--navy);font-weight:700}
.tl-h .dt{font-size:11.5px;color:var(--muted);font-family:var(--f-mono)}
.tl-scroll{overflow-x:auto;padding-bottom:6px;margin-inline:-4px}
.tl-scroll .tl-h{min-width:880px}

/* vertical timeline */
.tl-v{position:relative;display:flex;flex-direction:column}
.tl-v .ev{position:relative;display:grid;grid-template-columns:40px 1fr;gap:14px;padding-bottom:22px}
.tl-v .ev::before{content:"";position:absolute;top:34px;bottom:0;inset-inline-start:19px;width:2px;background:var(--line)}
.tl-v .ev:last-child::before{display:none}
.tl-v .ev.done::before{background:var(--royal)}
.tl-v .vd{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--bg);border:1px solid var(--line);color:var(--muted);position:relative}
.tl-v .done .vd{background:var(--royal);border-color:var(--royal);color:#fff}
.tl-v .cur .vd{background:#fff;border:2px solid var(--teal);color:var(--teal);box-shadow:0 0 0 5px rgba(8,167,198,.14)}
.tl-v .vt{font-weight:700;color:var(--navy);display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline}
.tl-v .pend .vt{color:var(--muted);font-weight:600}
.tl-v .vm{font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:2px}
.tl-v .vn{font-size:14px;color:var(--ink-2);margin-top:6px;background:var(--bg);border-radius:10px;padding:8px 12px;border:1px solid var(--line-2)}

/* badges */
.badge{display:inline-flex;align-items:center;gap:6px;height:26px;padding-inline:10px;border-radius:20px;font-size:12.5px;font-weight:700;white-space:nowrap}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.b-blue{background:#E6F0FA;color:var(--royal)}
.b-teal{background:var(--info-bg);color:#067F97}
.b-good{background:var(--good-bg);color:var(--good)}
.b-warn{background:var(--warn-bg);color:var(--warn)}
.b-bad{background:var(--bad-bg);color:var(--bad)}
.b-gray{background:#EEF2F6;color:var(--ink-2)}
.b-gold{background:#FAF1DD;color:#8E6414}
.tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding-inline:9px;border-radius:7px;background:var(--tint);color:var(--navy);font-size:12px;font-weight:600}

/* cards */
.card{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-lg);box-shadow:var(--sh)}
.pad{padding:24px}

/* network */
.net{background:#fff}
.net-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
@media (max-width:1000px){.net-grid{grid-template-columns:1fr}}
.map-card{position:relative;background:radial-gradient(120% 90% at 50% 0%,#F1F8FD,#fff);border:1px solid var(--line-2);border-radius:24px;overflow:hidden;padding:12px}
.map-scroll{overflow-x:auto}
.map-scroll svg{display:block;width:100%;min-width:640px;height:auto}
.route-list{display:flex;flex-direction:column;gap:8px}
.rt{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--line-2);border-radius:14px;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s;text-align:start;width:100%}
.rt:hover,.rt.on{border-color:var(--teal);box-shadow:var(--sh)}
.rt.on{background:#F6FCFE}
.rt .rn{font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px}
.rt .rm{font-size:12.5px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap}
.rt .rico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--tint);color:var(--royal)}
.map-legend{display:flex;flex-wrap:wrap;gap:16px;font-size:12.5px;color:var(--muted);padding:6px 12px 4px}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.route-path{fill:none;stroke-width:2;stroke-linecap:round;stroke-dasharray:1 7;animation:dash 1.6s linear infinite}
.route-path.hl{stroke-width:3}
@keyframes dash{to{stroke-dashoffset:-16}}
.pulse{animation:pulse 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{0%{transform:scale(.6);opacity:.7}100%{transform:scale(2.4);opacity:0}}

/* quick quote band */
.qband{background:linear-gradient(135deg,var(--navy) 0%,#073A70 100%);color:#fff;border-radius:28px;padding:40px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:36px;position:relative;overflow:hidden}
.qband::after{content:"";position:absolute;inset-inline-end:-80px;top:-80px;width:280px;height:280px;border-radius:50%;border:1px solid rgba(214,165,58,.25)}
.qband h2{color:#fff;font-size:clamp(26px,3vw,38px)}
.qband p{color:#BFD2E6;margin-top:12px}
.qband .field label{color:#BFD2E6}
.qband .inp{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff}
.qband select.inp option{color:var(--ink)}
.qband .inp::placeholder{color:#8FAACA}
.qsteps{display:flex;flex-direction:column;gap:12px;margin-top:26px}
.qsteps div{display:flex;gap:12px;align-items:center;color:#D8E5F2;font-size:14.5px}
.qsteps b{width:28px;height:28px;border-radius:50%;border:1px solid rgba(214,165,58,.6);color:var(--gold);display:grid;place-items:center;font-size:13px;flex:none;font-family:var(--f-mono)}
@media (max-width:900px){.qband{grid-template-columns:1fr;padding:26px}}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.svc{position:relative;background:#fff;border:1px solid var(--line-2);border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:12px;transition:transform .25s,box-shadow .25s,border-color .25s}
.svc:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:#CFE0EE}
.svc .ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#EAF4FB,#F4FAFD);color:var(--royal);border:1px solid var(--line-2)}
.svc:hover .ic{color:var(--teal)}
.svc h3{font-size:18px}
.svc p{font-size:14px;color:var(--ink-2)}
.svc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.svc ul li{font-size:12px;font-weight:600;color:var(--ink-2);background:var(--bg);border:1px solid var(--line-2);border-radius:6px;padding:2px 8px}
.svc.feat{grid-row:span 2;background:linear-gradient(170deg,#fff 40%,#EEF6FC)}
.svc .code{position:absolute;top:22px;inset-inline-end:22px;font-family:var(--f-mono);font-size:11px;color:#9DB2C7}

/* country cards */
.cty-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1000px){.cty-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.cty-grid{grid-template-columns:1fr}}
.cty{position:relative;border-radius:20px;overflow:hidden;background:var(--navy);color:#fff;padding:24px;min-height:250px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;isolation:isolate;transition:transform .25s}
.cty:hover{transform:translateY(-4px)}
.cty svg.bgmap{position:absolute;z-index:-1;width:360%;height:auto;opacity:.9}
.cty::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,43,85,.2),rgba(5,43,85,.92) 70%)}
.cty .code{font-family:var(--f-mono);font-size:12px;color:var(--gold);letter-spacing:.1em}
.cty h3{color:#fff;font-size:24px}
.cty p{color:#BCD0E4;font-size:13.5px;margin-top:6px}
.cty .link-arrow{color:#fff}

/* why + stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden}
.stat{padding:28px 24px;border-inline-start:1px solid var(--line-2)}
.stat:first-child{border-inline-start:0}
.stat b{display:block;font-family:var(--f-disp);font-size:clamp(32px,3.6vw,46px);color:var(--navy);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.stat b sup{color:var(--gold);font-size:.55em;vertical-align:top;margin-inline-start:2px}
.stat span{color:var(--muted);font-size:14px;font-weight:500}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(3){border-inline-start:0}.stat:nth-child(n+3){border-top:1px solid var(--line-2)}}
.why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:28px;border-top:1px solid var(--line)}
.why{padding:22px 20px 22px 0;display:flex;gap:12px;align-items:flex-start;border-bottom:1px solid var(--line)}
html[dir="rtl"] .why{padding:22px 0 22px 20px}
.why svg{color:var(--teal);margin-top:2px}
.why b{display:block;color:var(--navy);font-size:15.5px}
.why span{font-size:13.5px;color:var(--muted)}
@media (max-width:900px){.why-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.why-grid{grid-template-columns:1fr}}

/* benefits */
.ben{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:center;padding-block:36px}
.ben:nth-child(even) .ben-txt{order:2}
.ben-txt .n{font-family:var(--f-mono);color:var(--gold);font-size:13px}
.ben-txt h3{font-size:clamp(24px,2.6vw,32px);margin-top:8px}
.ben-txt p{color:var(--ink-2);margin-top:12px;max-width:44ch}
.ben-txt .btn{margin-top:22px}
.mock{background:#fff;border-radius:20px;box-shadow:var(--sh-lg);border:1px solid var(--line-2);overflow:hidden}
.mock-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--line-2);background:var(--bg)}
.mock-bar i{width:9px;height:9px;border-radius:50%;background:#D5E0EA}
.mock-bar span{margin-inline-start:10px;font-size:11.5px;color:var(--muted);font-family:var(--f-mono)}
.mock-body{padding:20px}
@media (max-width:900px){.ben{grid-template-columns:1fr;gap:24px}.ben:nth-child(even) .ben-txt{order:0}}

/* group strip */
.group{background:#fff;border-block:1px solid var(--line-2)}
.group-in{display:flex;flex-wrap:wrap;align-items:center;gap:20px 40px;padding-block:28px}
.group-lbl{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:600;flex:none}
html[lang="ar"] .group-lbl{letter-spacing:0;font-size:14px;font-weight:700}
.group-logos{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.glogo{height:84px;border:1px solid var(--line-2);border-radius:14px;display:flex;align-items:center;justify-content:center;padding:12px 16px;background:#fff;transition:border-color .25s,box-shadow .25s}
.glogo img{max-height:56px;max-width:100%;width:auto;object-fit:contain;transition:transform .3s}
.glogo:hover{border-color:#CFE0EE;box-shadow:var(--sh)}
.glogo:hover img{transform:scale(1.04)}
.fchip{display:inline-flex;align-items:center;justify-content:center;height:60px;padding:8px 16px;background:#fff;border-radius:10px}
.fchip img{max-height:44px;width:auto;max-width:150px;object-fit:contain}
@media (max-width:900px){.group-logos{grid-template-columns:repeat(2,1fr)}}

/* contact band */
.cband{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:24px;padding:32px}
.cband h2{font-size:clamp(24px,2.6vw,32px)}
.cband p{color:var(--ink-2);margin-top:8px}
.cband .acts{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:760px){.cband{grid-template-columns:1fr;padding:22px}}

/* footer */
.ftr{overflow-wrap:anywhere;background:var(--navy);color:#AFC4DA;padding-top:64px;margin-top:0}
.ftr-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr) 1.3fr;gap:32px}
.ftr h4{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;font-family:var(--f-body);font-weight:600}
html[lang="ar"] .ftr h4{letter-spacing:0;font-size:15px}
.ftr a{color:#AFC4DA;display:block;padding-block:4px;font-size:14.5px}
.ftr a:hover{color:#fff}
.ftr .logo{color:#fff}
.ftr .logo-t small{color:#7F9BB9}
.ftr p{font-size:14px;margin-top:14px;max-width:34ch}
.ftr .ci{display:flex;gap:10px;align-items:flex-start;font-size:14px;padding-block:5px}
.ftr .ci svg{color:var(--teal);margin-top:3px}
.soc{display:flex;gap:8px;margin-top:16px}
.soc a{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;padding:0;font-size:12px;font-weight:700;color:#CFE0F0}
.soc a:hover{border-color:var(--gold);color:var(--gold)}
.ftr-group{margin-top:48px;padding-block:22px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center}
.ftr-group span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#7F9BB9}
html[lang="ar"] .ftr-group span{letter-spacing:0;font-size:13px}
.ftr-group b{color:#D8E4F0;font-weight:600;font-size:14px;opacity:.8}
.ftr-bot{border-top:1px solid rgba(255,255,255,.1);padding-block:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px;color:#7F9BB9}
@media (max-width:1000px){.ftr-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ftr-grid>div:first-child{grid-column:1/-1}}

/* page head */
.phead{background:var(--navy);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.phead svg.bgmap{position:absolute;z-index:-2;width:130%;height:auto;inset-inline-end:-10%;top:-10%;opacity:.55}
.phead::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--navy) 30%,rgba(5,43,85,.55))}
html[dir="rtl"] .phead::before{background:linear-gradient(270deg,var(--navy) 30%,rgba(5,43,85,.55))}
.phead-in{padding-block:60px 56px}
.phead h1{color:#fff;font-size:clamp(32px,4.4vw,54px);margin-top:12px;max-width:20ch}
.phead p{color:#C2D4E7;max-width:60ch;margin-top:14px;font-size:17px}
.phead .eyebrow{color:var(--teal)}
.crumbs{font-size:13px;color:#8FAACA;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:#BFD2E6}

/* generic layout */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:900px){.two,.split{grid-template-columns:minmax(0,1fr)}}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0;border:1px solid var(--line-2);border-radius:16px;overflow:hidden;background:#fff}
.kv div{padding:14px 16px;border-bottom:1px solid var(--line-2);border-inline-end:1px solid var(--line-2)}
.kv dt{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
html[lang="ar"] .kv dt{letter-spacing:0;text-transform:none;font-size:12.5px}
.kv dd{margin:3px 0 0;font-weight:600;color:var(--navy);font-size:14.5px;overflow-wrap:anywhere}
.stack{display:flex;flex-direction:column;gap:16px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.muted{color:var(--muted)}
.small{font-size:13px}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line-2);border-radius:16px;background:#fff}
table.tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:720px}
.tbl th{text-align:start;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:12px 14px;background:var(--bg);border-bottom:1px solid var(--line-2);white-space:nowrap}
html[lang="ar"] .tbl th{letter-spacing:0;text-transform:none;font-size:13px}
.tbl td{padding:13px 14px;border-bottom:1px solid var(--line-2);vertical-align:middle;white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr{transition:background .15s}
.tbl tbody tr:hover{background:#F8FBFE}
.tbl tr.clk{cursor:pointer}
.tbl .t-strong{font-weight:700;color:var(--navy)}

/* dashboard shell */
.dash{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - var(--hdr));background:var(--bg)}
.side{background:#fff;border-inline-end:1px solid var(--line-2);padding:20px 14px;display:flex;flex-direction:column;gap:2px;position:sticky;top:calc(var(--hdr) + env(safe-area-inset-top,0px));height:calc(100vh - var(--hdr));overflow:auto}
.side.dark{background:var(--navy);border:0}
.side .who{display:flex;gap:10px;align-items:center;padding:6px 8px 18px;margin-bottom:8px;border-bottom:1px solid var(--line-2)}
.side.dark .who{border-color:rgba(255,255,255,.1)}
.avatar{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--royal),var(--teal));color:#fff;display:grid;place-items:center;font-weight:700;flex:none;font-size:14px}
.side .who b{display:block;color:var(--navy);font-size:14px;line-height:1.3}
.side.dark .who b{color:#fff}
.side .who small{color:var(--muted);font-size:12px}
.side.dark .who small{color:#8FAACA}
.side .sl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:14px 10px 6px;font-weight:600}
html[lang="ar"] .side .sl{letter-spacing:0;font-size:12px}
.side.dark .sl{color:#6D8BAC}
.side a.sn{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--ink-2);font-weight:600;font-size:14.5px;cursor:pointer}
.side a.sn:hover{background:var(--tint);color:var(--navy)}
.side a.sn.on{background:#EAF3FB;color:var(--navy)}
.side a.sn.on svg{color:var(--royal)}
.side.dark a.sn{color:#AFC4DA}
.side.dark a.sn:hover{background:rgba(255,255,255,.06);color:#fff}
.side.dark a.sn.on{background:rgba(8,167,198,.14);color:#fff}
.side.dark a.sn.on svg{color:var(--teal)}
.side a.sn .cnt{margin-inline-start:auto;font-size:11.5px;background:var(--gold);color:var(--navy);border-radius:10px;padding:0 7px;font-weight:700}
.dmain{padding:28px;min-width:0}
.dtop{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:22px}
.dtop h1{font-size:26px}
.dtop p{color:var(--muted);font-size:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.kpi{background:#fff;border:1px solid var(--line-2);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:6px}
.kpi .kl{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:13px;font-weight:600}
.kpi .kl svg{color:var(--royal)}
.kpi b{font-family:var(--f-disp);font-size:30px;color:var(--navy);font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1}
.kpi .kd{font-size:12.5px;color:var(--good);font-weight:600}
.kpi .kd.w{color:var(--warn)}
.panel{background:#fff;border:1px solid var(--line-2);border-radius:18px;padding:20px}
.panel-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.panel-h h3{font-size:16px}
html[lang="ar"] .panel-h h3{font-size:17px}
.dgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin-top:16px}
.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c12{grid-column:span 12}
@media (max-width:1100px){.c4,.c5,.c6,.c7,.c8{grid-column:span 12}}
.mob-tabs{display:none}
@media (max-width:900px){
  .dash{grid-template-columns:1fr}
  .side{display:none}
  .mob-tabs{display:flex;gap:6px;overflow-x:auto;padding:12px 16px;background:#fff;border-bottom:1px solid var(--line-2);position:sticky;top:calc(var(--hdr) + env(safe-area-inset-top,0px));z-index:5}
  .mob-tabs a{flex:none;padding:8px 12px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--ink-2);background:var(--bg);border:1px solid var(--line-2);cursor:pointer}
  .mob-tabs a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
  .dmain{padding:18px 16px}
}

/* charts */
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart text{font-family:var(--f-body);fill:var(--muted);font-size:11px}
html[lang="ar"] .chart text{font-family:var(--f-ar)}
.chart .gl{stroke:var(--line-2);stroke-width:1}
.chart .hit{fill:transparent;cursor:crosshair}
.chart .bar{transition:opacity .15s}
.chart .bar:hover{opacity:.82}
.legend{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13px;color:var(--ink-2);margin-top:10px}
.legend span{display:inline-flex;align-items:center;gap:7px}
.legend i{width:10px;height:10px;border-radius:3px}
.legend b{color:var(--navy)}
.hbar{display:grid;grid-template-columns:minmax(0,150px) 1fr 44px;gap:10px;align-items:center;font-size:13px;padding-block:6px}
.hbar .tr{height:10px;background:var(--line-2);border-radius:5px;overflow:hidden}
.hbar .tr i{display:block;height:100%;background:var(--royal);border-radius:5px}
.hbar b{text-align:end;color:var(--navy);font-variant-numeric:tabular-nums}
.tip{position:fixed;z-index:200;pointer-events:none;background:var(--navy);color:#fff;font-size:12.5px;padding:7px 10px;border-radius:8px;box-shadow:var(--sh-lg);white-space:nowrap;transform:translate(-50%,calc(-100% - 12px));opacity:0;transition:opacity .12s}
.tip.on{opacity:1}
.tip b{color:var(--gold)}

/* modal */
.modal{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-start;justify-content:center;padding:calc(40px + env(safe-area-inset-top,0px)) 16px 40px;overflow:auto;background:rgba(5,43,85,.5)}
.modal-p{background:#fff;border-radius:22px;width:min(760px,100%);box-shadow:var(--sh-lg);animation:pageIn .3s ease}
.modal-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--line-2)}
.modal-h h3{font-size:18px}
.modal-b{padding:22px}
.modal-f{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;padding:16px 22px;border-top:1px solid var(--line-2);background:var(--bg);border-radius:0 0 22px 22px}

/* toast */
.toast{position:fixed;z-index:220;left:50%;bottom:calc(28px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--navy);color:#fff;padding:12px 18px;border-radius:12px;box-shadow:var(--sh-lg);display:flex;gap:10px;align-items:center;font-weight:600;font-size:14px;opacity:0;transition:all .3s;pointer-events:none;max-width:calc(100vw - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast svg{color:var(--teal)}
@media (max-width:760px){.toast{bottom:calc(92px + env(safe-area-inset-bottom,0px))}}

/* success */
.success{text-align:center;padding:40px 20px;display:flex;flex-direction:column;align-items:center;gap:12px}
.success .ok{width:72px;height:72px;border-radius:50%;background:var(--good-bg);color:var(--good);display:grid;place-items:center}
.success h3{font-size:24px}
.success .ref{font-family:var(--f-mono);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 14px;color:var(--navy);font-weight:600}

/* blog */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.post{background:#fff;border:1px solid var(--line-2);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s;cursor:pointer;color:inherit}
.post:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.post .cov{height:150px;background:var(--navy);position:relative;overflow:hidden;display:grid;place-items:center;color:rgba(255,255,255,.85)}
.post .cov .big{font-family:var(--f-mono);font-size:30px;font-weight:600;color:#fff;letter-spacing:.04em;z-index:1}
.post .cov svg.bgmap{position:absolute;width:300%;opacity:.7}
.post .pb{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.post h3{font-size:18px}
.post p{font-size:14px;color:var(--ink-2)}
.post .pm{font-size:12.5px;color:var(--muted);margin-top:auto;padding-top:8px;display:flex;gap:12px}
.article{max-width:760px}
.article h2{font-size:24px;margin-top:34px;margin-bottom:10px}
.article p{margin-top:12px;color:var(--ink-2);font-size:16.5px}
.article ul,.article ol{color:var(--ink-2);font-size:16px;padding-inline-start:22px}
.article li{margin-top:6px}
.callout{background:#fff;border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:12px;padding:16px 18px;margin-top:20px}

/* branches */
.br-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:900px){.br-grid{grid-template-columns:1fr}}
.br{background:#fff;border:1px solid var(--line-2);border-radius:20px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 200px}
.br .bi{padding:22px;display:flex;flex-direction:column;gap:10px}
.br .bm{position:relative;background:#EDF5FB;overflow:hidden;min-height:220px;display:block}
.br .bm svg{position:absolute;width:500%;height:auto}
.br .bm .open{position:absolute;inset-inline:10px;bottom:10px;background:#fff;border-radius:10px;padding:8px 10px;font-size:12.5px;font-weight:700;color:var(--royal);display:flex;align-items:center;gap:6px;justify-content:center;box-shadow:var(--sh)}
.br h3{font-size:20px;display:flex;align-items:center;gap:10px}
.br .cc{font-family:var(--f-mono);font-size:11px;background:var(--navy);color:var(--gold);border-radius:6px;padding:2px 7px;letter-spacing:.1em}
.br .li{overflow-wrap:anywhere;display:flex;gap:10px;font-size:14px;color:var(--ink-2);align-items:flex-start}
.br .li svg{color:var(--teal);margin-top:3px}
@media (max-width:560px){.br{grid-template-columns:1fr}.br .bm{min-height:160px}}
.copy{border:0;background:var(--tint);color:var(--royal);border-radius:6px;font-size:11.5px;font-weight:700;padding:1px 7px;cursor:pointer;margin-inline-start:6px}

/* misc */
.empty{padding:30px;text-align:center;color:var(--muted)}
.alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;font-size:14px}
.alert.bad{background:var(--bad-bg);color:var(--bad)}
.alert.info{background:var(--info-bg);color:#066A7E}
.alert.gold{background:#FBF4E3;color:#7A5712}
.divider{height:1px;background:var(--line-2);margin-block:18px}
.notif{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line-2)}
.notif:last-child{border:0}
.notif .ni{width:38px;height:38px;border-radius:11px;background:var(--info-bg);color:#067F97;display:grid;place-items:center;flex:none}
.notif b{color:var(--navy);font-size:14.5px}
.notif p{font-size:13.5px;color:var(--ink-2)}
.notif small{font-size:12px;color:var(--muted)}
.phone{width:min(300px,100%);margin-inline:auto;background:#E7DED3;border-radius:26px;padding:14px;border:8px solid #0B1F36}
.bubble{background:#fff;border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.55;box-shadow:0 1px 1px rgba(0,0,0,.08);white-space:pre-wrap}
.bubble small{display:block;text-align:end;color:#8a8a8a;font-size:11px;margin-top:4px}
.switch{position:relative;width:42px;height:24px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;background:#CAD7E3;border-radius:20px;cursor:pointer;transition:.2s}
.switch span::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;inset-inline-start:3px;transition:.2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked+span{background:var(--teal)}
.switch input:checked+span::after{inset-inline-start:21px}
.switch input:focus-visible+span{outline:2px solid var(--teal);outline-offset:2px}
.perm td,.perm th{text-align:center}
.perm td:first-child,.perm th:first-child{text-align:start}
.chk{width:18px;height:18px;accent-color:var(--royal)}
.auth{min-height:calc(100vh - var(--hdr));display:grid;grid-template-columns:1fr 1fr}
.auth-art{background:var(--navy);position:relative;overflow:hidden;color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}
.auth-art svg.bgmap{position:absolute;z-index:-1;width:220%;top:10%;inset-inline-start:-60%;opacity:.8}
.auth-art h2{color:#fff;font-size:32px;max-width:16ch}
.auth-art p{color:#BCD0E4;margin-top:10px;max-width:40ch}
.auth-f{display:grid;place-items:center;padding:40px 20px}
.auth-f form{width:min(400px,100%);display:flex;flex-direction:column;gap:16px}
.auth-f h1{font-size:28px}
@media (max-width:900px){.auth{grid-template-columns:1fr}.auth-art{display:none}}
pre.code{background:#0B1F36;color:#CFE3F5;border-radius:14px;padding:16px;font-family:var(--f-mono);font-size:12.5px;line-height:1.6;overflow:auto;max-height:360px;margin:0;direction:ltr;text-align:left}
.ltr{direction:ltr;unicode-bidi:isolate}
.calc{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-top:20px}
.calc .res{font-family:var(--f-mono);font-size:22px;color:var(--navy);font-weight:600}
.fbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.fbar .inp{height:40px;width:auto;min-width:0;font-size:14px}
.fbar .grow{flex:1;min-width:180px}
.pill-f{height:36px;padding-inline:12px;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer}
.pill-f.on{background:var(--navy);border-color:var(--navy);color:#fff}
.seo-row{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:14px 0;border-bottom:1px solid var(--line-2)}
.seo-row .u{font-family:var(--f-mono);font-size:12.5px;color:var(--good)}
.seo-row .t{color:#1a0dab;font-size:17px;font-family:var(--f-body)}
html[lang="ar"] .seo-row .t{font-family:var(--f-ar)}
.seo-row .d{font-size:13.5px;color:var(--ink-2)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

.bgfill{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.cty svg.bgfill,.post .cov svg.bgfill,.br .bm svg.bgfill{z-index:0}
.post .cov .big{position:relative}
.br .bm svg.bgfill{position:absolute}

/* ============ CUSTOMER ACCOUNTS (registration · OTP · PL) ============ */
.btn-acc{background:linear-gradient(135deg,#E2B551,#C9952C);color:var(--navy);box-shadow:0 6px 16px -8px rgba(201,149,44,.7)}
.btn-acc:hover{background:linear-gradient(135deg,#E8BE5E,#D09E35)}
.btn-acc.lg{height:50px}
.btn-acc.me{background:var(--tint);color:var(--navy);box-shadow:none;border-color:var(--line);padding-inline:6px 14px;gap:8px}
.btn-acc.me .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-size:11.5px;font-weight:700}
@media (max-width:1100px){.hdr-act .btn-acc:not(.me){padding-inline:12px}}
.acc-modal{align-items:center;padding-block:24px}
.acc-p{width:min(460px,100%);padding:30px 28px 24px;position:relative;text-align:start}
.acc-x{position:absolute;top:14px;inset-inline-end:14px}
.acc-brand{display:flex;justify-content:center;margin-bottom:14px}
.acc-brand img{width:56px;height:56px;border-radius:50%;filter:drop-shadow(0 4px 10px rgba(5,43,85,.25))}
.acc-steps{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:20px;font-size:12px;color:var(--muted);font-weight:600}
.acc-steps span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.acc-steps i{font-style:normal;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--line-2);color:var(--muted);font-size:11.5px}
.acc-steps i svg{width:13px;height:13px}
.acc-steps .on{color:var(--navy)}.acc-steps .on i{background:var(--royal);color:#fff}
.acc-steps .done i{background:var(--good);color:#fff}
.acc-steps b{flex:0 1 22px;height:1.5px;background:var(--line)}
@media (max-width:420px){.acc-steps span:not(.on){font-size:0;gap:0}}
.acc-p h2{font-size:23px;text-align:center}
.acc-sub{color:var(--ink-2);margin-top:8px;text-align:center;font-size:14.5px}
.c{text-align:center}
.acc-f{display:flex;flex-direction:column;gap:16px;margin-top:22px}
.acc-f .field label{font-weight:600}
.req{color:var(--bad)}
.acc-phone{display:flex;gap:8px;direction:ltr}
.acc-cc{width:118px!important;flex:none;padding-inline:12px 30px!important;background-position:right 12px center!important}
.acc-custom{display:flex;align-items:center;width:84px;flex:none;position:relative}
.acc-custom span{position:absolute;left:12px;color:var(--muted);font-weight:600}
.acc-custom .inp{padding-left:24px}
.acc-phone #acc-num{flex:1;letter-spacing:.04em;font-variant-numeric:tabular-nums;text-align:left}
.acc-go{height:52px;font-size:16px;width:100%}
.acc-go:disabled{opacity:.75;cursor:progress}
.acc-alt{text-align:center;margin-top:16px;font-size:14px;color:var(--ink-2)}
.acc-alt a{font-weight:700}
.acc-demo{display:flex;gap:8px;align-items:flex-start;margin-top:16px;padding:10px 12px;border-radius:10px;background:var(--bg);color:var(--muted);font-size:12.5px;line-height:1.55}
.acc-demo.c{justify-content:center}
.acc-demo svg{width:16px;height:16px;flex:none;margin-top:2px}
.ltr-i{direction:ltr;unicode-bidi:isolate;display:inline-block}
.spin{width:18px;height:18px;border-radius:50%;border:2.2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.otp{display:flex;gap:10px;justify-content:center;direction:ltr}
.otp-i{width:52px;height:60px;border:1.5px solid var(--line);border-radius:13px;text-align:center;font:600 26px var(--f-mono);color:var(--navy);background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s;min-width:0}
.otp-i:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(8,167,198,.15);transform:translateY(-1px)}
.otp-i:not(:placeholder-shown),.otp-i:valid{border-color:#9DBBD6}
.otp-i:disabled{background:var(--bg)}
@media (max-width:400px){.otp{gap:6px}.otp-i{width:44px;height:54px;font-size:22px}}
.otp.shake{animation:shake .4s}
.otp.shake .otp-i{border-color:var(--bad)}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.otp-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-2);flex-wrap:wrap}
.otp-meta span{display:inline-flex;align-items:center;gap:6px}
.otp-meta svg{width:15px;height:15px}
.bad-t{color:var(--bad);font-weight:600;display:inline-flex;gap:6px;align-items:center}
.otp-resend{background:none;border:0;padding:4px 0;color:var(--royal);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:13.5px}
.otp-resend:disabled{color:var(--muted);font-weight:500;cursor:default}
.otp-resend svg{width:15px;height:15px}
.acc-ok{width:72px;height:72px;margin:6px auto 16px;border-radius:50%;display:grid;place-items:center;background:var(--good-bg);color:var(--good);animation:pop .45s cubic-bezier(.2,1.4,.4,1)}
.acc-ok svg{width:36px;height:36px;stroke-width:2.4}
@keyframes pop{from{transform:scale(.4);opacity:0}}
.pl-card{margin:22px 0 4px;padding:22px;border-radius:18px;text-align:center;color:#fff;background:radial-gradient(120% 140% at 100% 0%,#0E5DA8 0%,#052B55 55%,#031E3D 100%);position:relative;overflow:hidden;box-shadow:0 18px 40px -20px rgba(5,43,85,.6)}
.pl-card::after{content:"";position:absolute;inset:auto -30% -60% auto;width:220px;height:220px;border-radius:50%;border:1px solid rgba(214,165,58,.35)}
.pl-l{display:block;font-size:12.5px;color:#9FC0E0;letter-spacing:.04em}
.pl-n{display:block;font:700 40px/1.15 var(--f-mono);letter-spacing:.08em;margin-top:6px;color:#fff;direction:ltr}
.pl-n::first-letter{color:var(--gold)}
.pl-m{display:inline-flex!important;align-items:center;gap:6px;margin-top:10px;font-size:13px;color:#BCD0E4}
.pl-m svg{width:14px;height:14px;color:#5FD39E}
.acc-note{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:14px;font-size:14px;color:var(--ink-2)}
.acc-note svg{color:var(--gold)}
.acc-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.acc-btns .btn{padding-inline:12px}
.acc-btns .btn:only-child{grid-column:1/-1}
@media (max-width:440px){.acc-btns{grid-template-columns:1fr}}
.btn.copied{border-color:var(--good);color:var(--good)}
#sms-stack{position:fixed;top:calc(14px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);z-index:240;width:min(380px,calc(100% - 24px));display:flex;flex-direction:column;gap:8px;pointer-events:none}
.sms{pointer-events:auto;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:18px;padding:12px 14px;box-shadow:0 18px 44px -14px rgba(5,23,45,.45),0 0 0 1px rgba(5,43,85,.06);transform:translateY(-130%);opacity:0;transition:transform .45s cubic-bezier(.2,1.2,.4,1),opacity .3s}
.sms.on{transform:none;opacity:1}
.sms-h{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.sms-h b{color:var(--ink);font-size:13px}
.sms-h span:not(.sms-ic){margin-inline-start:auto}
.sms-h em{font-style:normal;font-size:10px;font-weight:700;background:var(--warn-bg);color:var(--warn);padding:2px 6px;border-radius:6px}
.sms-ic{width:24px;height:24px;border-radius:7px;background:#34C759;color:#fff;display:grid;place-items:center}
.sms-ic svg{width:14px;height:14px}
.sms p{margin-top:6px;font-size:14px;color:var(--ink);line-height:1.5}
.sms-fill{margin-top:8px;border:0;background:var(--tint);color:var(--royal);font-weight:700;border-radius:9px;padding:7px 12px;cursor:pointer;font-size:13px}
.sms-fill .mono{margin-inline-start:4px;letter-spacing:.15em}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.alert.small{font-size:13px}
.member{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:22px 24px;border-radius:20px;color:#fff;background:radial-gradient(120% 160% at 100% 0%,#0E5DA8 0%,#052B55 55%,#031E3D 100%);box-shadow:var(--sh-lg)}
.member-l{display:flex;align-items:center;gap:16px}
.member-l img{width:64px;height:64px;border-radius:50%;flex:none}
.member .pl-n{font-size:30px;margin-top:2px}
.member-n{display:block;color:#BCD0E4;font-size:14px;margin-top:2px}
.member-r{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.member-r span{display:flex;flex-direction:column;gap:2px}
.member-r small{color:#8FB0D0;font-size:12px}
.member-r b{font-size:14.5px}
.member-copy{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.22)}
.member-copy:hover{background:rgba(255,255,255,.18)}
.acc-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:28px 12px;color:var(--ink-2)}
.acc-empty>svg{width:40px;height:40px;color:#9DBBD6;stroke-width:1.3}
.acc-empty b{color:var(--navy);font-size:16px}
.acc-empty p{max-width:40ch;font-size:14px}
.acc-empty .btn{margin-top:6px}
.acc-dl{margin:0;display:flex;flex-direction:column}
.acc-dl div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-2)}
.acc-dl div:last-child{border:0}
.acc-dl dt{color:var(--muted);font-size:13.5px}
.acc-dl dd{margin:0;font-weight:600;color:var(--ink);text-align:end}
@media (max-width:640px){.hdr-act .btn-acc{display:inline-flex;height:40px;width:40px;padding:0;border-radius:11px}.hdr-act .btn-acc .lbl,.hdr-act .btn-acc.me .mono{display:none}.hdr-act .btn-acc.me{padding:0;width:40px}}
@media (min-width:641px) and (max-width:1000px){.hdr-act .btn-acc:not(.me){width:40px;padding:0}.hdr-act .btn-acc .lbl,.hdr-act .btn-acc.me .mono{display:none}.hdr-act .btn-acc.me{padding:0;width:40px;justify-content:center}.hdr-act .acct{display:none}}
@media (max-width:440px){.hdr-in{gap:6px}.hdr-act{gap:6px}.logo{gap:6px}.logo-mark{width:38px!important;height:38px!important}.logo-t b{font-size:11px!important;letter-spacing:0!important}.hdr-act .btn-acc,.hdr-act .icon-btn{width:38px;height:38px}.lang button{min-width:30px;padding:6px 6px}}
@media (max-width:640px){.hdr-act .hdr-track{display:inline-flex;width:40px;height:40px;padding:0;border-radius:11px;border-color:var(--line);color:var(--navy)}.hdr-act .hdr-track .lbl{display:none}}
@media (max-width:440px){.hdr-act .hdr-track{width:38px;height:38px}}
@media (max-width:385px){.logo-t{display:none}}
/* ---- floating account button ---- */
.wa-float{display:none!important}
.acc-float{position:fixed;z-index:90;right:20px;bottom:calc(24px + env(safe-area-inset-bottom,0px));direction:inherit;animation:afIn .7s cubic-bezier(.2,1.3,.4,1) .4s both}
.acc-float[hidden]{display:none}
.af-btn{position:relative;display:flex;align-items:center;gap:10px;padding:7px 18px 7px 7px;border:0;border-radius:40px;cursor:pointer;color:var(--navy);text-decoration:none;font:inherit;background:linear-gradient(135deg,#F0C76A,#D6A53A 55%,#B9862A);box-shadow:0 14px 30px -10px rgba(185,134,42,.75),0 0 0 1px rgba(255,255,255,.35) inset;overflow:hidden;isolation:isolate;transition:transform .25s,box-shadow .25s}
html[dir="rtl"] .af-btn{padding:7px 7px 7px 18px}
.af-btn:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 20px 36px -12px rgba(185,134,42,.85),0 0 0 1px rgba(255,255,255,.4) inset}
.af-btn::after{content:"";position:absolute;z-index:-1;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:afShine 3.6s ease-in-out 1.4s infinite}
.acc-float::before,.acc-float::after{content:"";position:absolute;inset:0;border-radius:40px;border:2px solid rgba(214,165,58,.7);animation:afPulse 2.4s ease-out infinite;pointer-events:none}
.acc-float::after{animation-delay:1.2s}
.af-ic{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;box-shadow:0 4px 10px -4px rgba(5,43,85,.6);animation:afWiggle 4s ease-in-out 2s infinite}
.af-ic svg{width:20px;height:20px}
.af-ic .av{font-size:13px;font-weight:700}
.af-t{display:flex;flex-direction:column;line-height:1.15;text-align:start}
.af-t b{font-size:15px;font-weight:800;white-space:nowrap}
.af-t small{font-size:11.5px;font-weight:600;opacity:.75;white-space:nowrap}
.acc-float.me::before,.acc-float.me::after{display:none}
.acc-float.me .af-btn{background:linear-gradient(135deg,#0E5DA8,#052B55);color:#fff;box-shadow:0 14px 30px -12px rgba(5,43,85,.7)}
.acc-float.me .af-ic{background:linear-gradient(135deg,#F0C76A,#C9952C);color:var(--navy);animation:none}
.acc-float.me .af-t small{color:#F0C76A;opacity:1;letter-spacing:.06em}
@keyframes afIn{from{opacity:0;transform:translateX(120%)}}
@keyframes afPulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.25,1.6);opacity:0}}
@keyframes afShine{0%{left:-60%}35%,100%{left:130%}}
@keyframes afWiggle{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-14deg)}92%{transform:rotate(12deg)}95%{transform:rotate(-6deg)}}
@media (max-width:760px){.acc-float{right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}.af-ic{width:38px;height:38px}.af-t b{font-size:14px}.af-t small{font-size:10.5px}}
@media (prefers-reduced-motion:reduce){.acc-float,.af-btn::after,.acc-float::before,.acc-float::after,.af-ic{animation:none!important}}
body:has(.acc-modal) .acc-float{opacity:0;pointer-events:none}