@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:300;src:url('../../assets/fonts/cairo-arabic-300-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:300;src:url('../../assets/fonts/cairo-latin-300-normal.woff2') format('woff2');}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:400;src:url('../../assets/fonts/cairo-arabic-400-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:400;src:url('../../assets/fonts/cairo-latin-400-normal.woff2') format('woff2');}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:500;src:url('../../assets/fonts/cairo-arabic-500-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:500;src:url('../../assets/fonts/cairo-latin-500-normal.woff2') format('woff2');}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:600;src:url('../../assets/fonts/cairo-arabic-600-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:600;src:url('../../assets/fonts/cairo-latin-600-normal.woff2') format('woff2');}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:700;src:url('../../assets/fonts/cairo-arabic-700-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:700;src:url('../../assets/fonts/cairo-latin-700-normal.woff2') format('woff2');}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:800;src:url('../../assets/fonts/cairo-arabic-800-normal.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F;}@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:800;src:url('../../assets/fonts/cairo-latin-800-normal.woff2') format('woff2');}.pvw{display:contents}.pvw[hidden]{display:none}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#15315A}
.hf{--b:#7399CE;--b6:#4675B8;--b7:#2F5D9E;--b1:#EEF3FA;--ink:#363A40;--tx:#5C6066;--mu:#676C73;--ln:#E4E9F0;--ease:cubic-bezier(.2,.7,.2,1);--sh:0 1px 2px rgba(23,43,77,.05),0 12px 30px -16px rgba(23,43,77,.24);--shh:0 2px 6px rgba(23,43,77,.07),0 28px 54px -22px rgba(23,43,77,.38);font-family:'Cairo',system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif;font-size:16px;line-height:1.85;color:var(--tx);background:#F2F3F5;-webkit-font-smoothing:antialiased;overflow-x:clip;interpolate-size:allow-keywords}
:where(.hf) :where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure,table){margin:0}
:where(.hf) :where(ul,ol){padding:0;list-style:none}
:where(.hf) img{display:block;max-width:100%;height:auto}
:where(.hf) a{color:inherit;text-decoration:none}
.hf :focus-visible{outline:2px solid var(--b6);outline-offset:3px}
.w{width:100%;max-width:1188px;margin-inline:auto;padding-inline:24px}
.ltr{direction:ltr;unicode-bidi:isolate}
.c{text-align:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hf [hidden]{display:none!important}
.pv{display:contents}
.svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.glyph{fill:currentColor}

/* platform switch: one pill per platform, the current one filled (the Tanaqul switch pattern) */
.sw-bar{position:sticky;top:0;z-index:41;height:60px;color:#fff;border-bottom:1px solid rgba(255,255,255,.16)}
.sw-in{height:100%;display:flex;align-items:center;justify-content:center}
.sw{display:flex;gap:2px;padding:4px;border-radius:999px;background:rgba(14,36,72,.26);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.sw a{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;min-height:40px;padding-inline:20px;border-radius:999px;font-size:14.5px;font-weight:600;line-height:1.25;white-space:nowrap;transition:background-color .25s}
.sw a:hover{background:color-mix(in srgb,currentColor 14%,transparent)}
.sw a[aria-current]{color:var(--b7);font-weight:700}
.sw a[aria-current]:hover{background:none}
.sw .th{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;box-shadow:0 8px 18px -10px rgba(8,22,50,.6);view-transition-name:sw-thumb}
.sw .lb{display:inline-flex;flex-direction:column;align-items:center}
/* every label reserves its bold width, so the switch keeps the same geometry on every page */
.sw .lb::after{content:attr(data-t);height:0;overflow:hidden;visibility:hidden;font-weight:700;pointer-events:none;user-select:none}
.hf .sw a:focus-visible{outline-color:currentColor;outline-offset:2px}

/* header */
.hd{position:sticky;top:60px;z-index:40;height:88px;color:#fff}
.hd-in{height:100%;display:flex;align-items:center;gap:16px}
.logo{position:relative;flex:none;display:block;width:168px;height:62px}
.logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:100% 50%}
.logo .lg-d{opacity:0}
.nav{display:flex;align-items:center;gap:2px;margin-inline-start:14px}
.nav a,.acts a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding-inline:12px;font-size:15.5px;font-weight:600;white-space:nowrap}
.nav a::after{content:"";position:absolute;inset-inline:12px;bottom:5px;height:2px;border-radius:2px;background:currentColor;transform:scaleX(0);transform-origin:100% 50%;transition:transform .35s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.acts a[aria-current="page"]::after{content:"";position:absolute;inset-inline:12px;bottom:5px;height:2px;border-radius:2px;background:currentColor}
.acts{margin-inline-start:auto;display:flex;align-items:center;gap:2px}
.acts .sep{width:1px;height:20px;margin-inline:6px;background:currentColor;opacity:.4}
.acts .pill{margin-inline-start:4px;padding-inline:18px;border-radius:999px;box-shadow:inset 0 0 0 1.5px currentColor;transition:background-color .25s}
.acts .pill:hover{background:#fff;color:var(--b7)}
.mnav{display:none;position:relative;margin-inline-start:auto}
.mnav summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:46px;height:46px;border-radius:12px}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary svg{width:26px;height:26px}
.mnav .panel{position:absolute;inset-inline-end:0;top:54px;width:280px;padding:8px;border-radius:16px;background:#fff;color:var(--ink);box-shadow:var(--shh);display:grid}
.mnav .panel a{display:flex;align-items:center;min-height:46px;padding-inline:14px;border-radius:10px;font-weight:600}
.mnav .panel a:hover,.mnav .panel a[aria-current="page"]{background:var(--b1);color:var(--b7)}
.mnav .panel hr{width:100%;height:1px;margin:6px 0;border:0;background:var(--ln)}
.mnav .msw{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:6px;border-radius:14px;background:#F1F5FB}
.mnav .panel .msw a{justify-content:center;min-height:46px;padding:6px 8px;font-size:13.5px;line-height:1.35;text-align:center;color:var(--ink)}
.mnav .panel .msw a:hover{background:#fff;color:var(--b7)}
.mnav .panel .msw a[aria-current]{background:var(--b6);color:#fff}
@supports (animation-timeline:scroll()){
 /* the header fades to white with the scroll (Aziz's effect). The text turns dark only once the white is mostly in,
    and the dark logo fades in on top before the white one goes, so the header stays readable all the way (2026-10-12) */
 .hd{animation:hdOn linear both,hdInk linear both;animation-timeline:scroll(root),scroll(root);animation-range:0px 90px,50px 90px}
 .hd .lg-d{animation:fi linear both;animation-timeline:scroll(root);animation-range:30px 75px}
 .hd .lg-l{animation:fo linear both;animation-timeline:scroll(root);animation-range:75px 110px}
 .sw-bar{animation:swBar linear both,hdInk linear both;animation-timeline:scroll(root),scroll(root);animation-range:0px 90px,50px 90px}
 .sw{animation:swPill linear both;animation-timeline:scroll(root);animation-range:0px 90px}
 .sw .th{animation:swTh linear both;animation-timeline:scroll(root);animation-range:0px 90px}
 .sw a[aria-current]{animation:swCur linear both;animation-timeline:scroll(root);animation-range:0px 90px}
}
@keyframes hdInk{to{color:var(--ink)}}
@keyframes hdOn{to{height:72px;background:rgba(255,255,255,.985);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(23,43,77,.06),0 14px 30px -22px rgba(23,43,77,.45)}}
@keyframes fo{to{opacity:0}}
@keyframes fi{to{opacity:1}}
@keyframes swBar{to{background:#F4F7FB;border-bottom-color:var(--ln)}}
@keyframes swPill{to{background:#fff;box-shadow:inset 0 0 0 1px var(--ln)}}
@keyframes swTh{to{background:var(--b6);box-shadow:0 8px 18px -10px rgba(47,93,158,.75)}}
@keyframes swCur{to{color:#fff}}
/* same end states for browsers without scroll-driven animations (the exported pages set .is-solid from a scroll listener) */
.is-solid .hd{height:72px;color:var(--ink);background:rgba(255,255,255,.985);box-shadow:0 1px 0 rgba(23,43,77,.06),0 14px 30px -22px rgba(23,43,77,.45)}
.is-solid .hd .lg-l{opacity:0}
.is-solid .hd .lg-d{opacity:1}
.is-solid .sw-bar{color:var(--ink);background:#F4F7FB;border-bottom-color:var(--ln)}
.is-solid .sw{background:#fff;box-shadow:inset 0 0 0 1px var(--ln)}
.is-solid .sw .th{background:var(--b6)}
.is-solid .sw a[aria-current]{color:#fff}
/* moving between platforms: the filled pill slides to the new platform where the browser supports view transitions */
@view-transition{navigation:auto}
::view-transition-group(sw-thumb){animation-duration:.45s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}

/* hero */
.hero{position:relative;isolation:isolate;overflow:hidden;margin-top:-148px;color:#fff;text-align:center}
.hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;background:#3F6AA8}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform-origin:50% 40%}
/* the landing hero plays the Riyadh skyline (Aziz 2026-10-12); the still image stays under it for reduced motion and while it loads */
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
@media (prefers-reduced-motion:reduce){.hero-vid{display:none}}
/* video heroes: a darker, less blue veil so the footage shows (Aziz 2026-10-12: «the hero is too light») */
.hero.hero-video::before{background:linear-gradient(180deg,rgba(6,16,34,.62) 0%,rgba(8,22,46,.48) 45%,rgba(10,28,58,.70) 100%)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(31,66,120,.82) 0%,rgba(56,100,166,.72) 40%,rgba(86,128,190,.78) 100%)}
.hero-in{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:820px;padding-block:190px 128px}
.hero-t{max-width:920px;font-size:64px;line-height:1.3;font-weight:300;color:#fff;text-wrap:balance;text-shadow:0 2px 30px rgba(10,30,70,.35)}
.hero-s{max-width:760px;margin-top:20px;font-size:22px;line-height:1.9;color:rgba(255,255,255,.95);text-wrap:balance}
.hero .ctas{margin-top:36px;justify-content:center}
.down{position:absolute;bottom:26px;inset-inline:0;margin-inline:auto;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:#fff}
.down svg{width:28px;height:28px}
.hero-hub .hero-in{min-height:760px;padding-block:220px 250px}
.hero-sm{text-align:start}
.hero-sm .hero-in{min-height:440px;align-items:flex-start;justify-content:flex-end;padding-block:190px 70px}
.hero-sm .hero-t{font-size:52px;font-weight:600}
.hero-sm .hero-s{margin-top:8px;font-size:19px}

/* motion */
@media (prefers-reduced-motion:no-preference){
 .hero-bg img{animation:kb 24s var(--ease) both}
 .rise{animation:rise 1.1s var(--ease) both}
 .r2{animation-delay:.16s}.r3{animation-delay:.32s}.r4{animation-delay:.5s}.r5{animation-delay:.62s}.r6{animation-delay:.74s}.r7{animation-delay:.86s}
 .down{animation:bob 2.6s ease-in-out 1.6s infinite}
 .play::after{content:"";position:absolute;inset:-12px;border-radius:50%;border:2px solid rgba(255,255,255,.55);animation:ring 2.6s ease-out infinite}
 .mq-track{animation:mq 70s linear infinite}
 .mq-rev .mq-track{animation-duration:56s;animation-direction:reverse}
 .mq:hover .mq-track{animation-play-state:paused}
 @supports (animation-timeline:view()){
  .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% entry 260px}
  .rvg>.rv:nth-child(3n+2){animation-range:entry 50px entry 310px}
  .rvg>.rv:nth-child(3n+3){animation-range:entry 100px entry 360px}
  .tile{view-timeline-name:--tile}
  }
}
@keyframes kb{from{transform:scale(1.16) translate(1.5%,-1%)}to{transform:scale(1.02)}}
@keyframes rise{from{opacity:0;translate:0 26px;filter:blur(8px)}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 8px}}
@keyframes rv{from{opacity:0;translate:0 40px}}
@keyframes ring{from{opacity:.9;transform:scale(.92)}to{opacity:0;transform:scale(1.4)}}
@keyframes mq{to{translate:50% 0}}
@keyframes odo{from{translate:0 0}}
.odo-wait .dg>span{translate:0 0}
@media (prefers-reduced-motion:no-preference){.odo-go .dg>span{animation:odo 1.6s cubic-bezier(.2,.7,.2,1) both}.odo-go .dg:nth-child(2n)>span{animation-duration:1.9s}.odo-go .dg:nth-child(3n)>span{animation-duration:2.2s}}
.dg{-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent)}

/* buttons */
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding-inline:26px;border-radius:10px;font-size:15.5px;font-weight:700;line-height:1.2;white-space:nowrap;transition:background-color .25s,color .25s,box-shadow .25s,transform .25s var(--ease)}
.btn:hover{transform:translateY(-2px)}
button.btn{border:0;font-family:inherit;cursor:pointer}
.btn svg{width:18px;height:18px;flex:none}
.btn .glyph{width:20px;height:20px}
.btn .arr{transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(-4px)}
.btn-wa{background:#367D28;color:#fff;box-shadow:0 12px 26px -14px rgba(20,70,10,.8)}
.btn-wa:hover{background:#2C6A20}
.btn-p{background:var(--b6);color:#fff;box-shadow:0 12px 26px -16px rgba(47,93,158,.9)}
.btn-p:hover{background:var(--b7)}
.btn-k{background:#000;color:#fff}
.btn-k:hover{background:#262626}
.btn-w{background:#fff;color:var(--b7)}
.btn-w:hover{background:var(--b1)}
.btn-o{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75)}
.btn-o:hover{background:rgba(255,255,255,.12)}

/* grounds */
.geo{position:relative;isolation:isolate;display:flow-root;background:#EFEFEF}
.geo-bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.geo-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.geo-bg::after{content:"";position:absolute;inset:0;background:rgba(240,240,240,.42)}
.sec{padding-block:84px}
.sec-tight{padding-top:0}
.sh{margin-bottom:40px}
.sh h2{font-size:34px;line-height:1.45;font-weight:700;color:var(--ink);text-wrap:balance}
.sh p{max-width:780px;margin-top:10px;font-size:17px;line-height:1.9;color:var(--tx);text-wrap:pretty}
.sh.c p{margin-inline:auto}
.sh-w h2{color:#fff}
.sh-w p{color:rgba(255,255,255,.93)}

/* cards */
.g2,.g3,.g4{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{position:relative;display:block;background:#fff;border-radius:16px;padding:32px;border:1px solid rgba(70,117,184,.11);box-shadow:var(--sh)}
.ct{font-size:22px;line-height:1.6;font-weight:700;color:var(--ink);text-wrap:balance}
.card h3{font-size:19px;line-height:1.55;font-weight:700;color:var(--ink)}
.card p{margin-top:12px}
.lk{color:var(--b7);font-weight:600;text-decoration:underline;text-decoration-color:rgba(47,93,158,.35);text-underline-offset:5px;transition:text-decoration-color .2s}
.lk:hover{text-decoration-color:currentColor}
.ic{display:grid;place-items:center;flex:none;width:64px;height:64px;border-radius:18px;background:var(--b1);transition:background-color .35s var(--ease)}
.ic img{width:38px;height:38px;transition:filter .35s}
a.card{transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .35s}
a.card:hover{transform:translateY(-6px);box-shadow:var(--shh);border-color:rgba(70,117,184,.3)}
a.card:hover .ic{background:var(--b6)}
a.card:hover .ic img{filter:brightness(0) invert(1)}
.chk{display:grid;gap:10px;margin-top:16px}
.chk li{position:relative;padding-inline-start:31px;line-height:1.75}
.chk li::before{content:"";position:absolute;inset-inline-start:0;top:.34em;width:19px;height:19px;background:url("../../assets/check-blue.svg") center/contain no-repeat}
.chk-w li::before{background-image:url("../../assets/check-white.svg")}

/* about */
.about{align-items:stretch}
.video{position:relative;isolation:isolate;display:block;margin-top:24px;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#1E3A66;box-shadow:var(--sh)}
.video>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform 1.4s var(--ease)}
.video::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,44,84,.38) 0%,rgba(20,44,84,.78) 100%)}
.video:hover>img{transform:scale(1.04)}
.play{position:absolute;z-index:2;inset:0;margin:auto;width:100px;height:100px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.96);color:var(--b6);transition:transform .35s var(--ease)}
.video:hover .play{transform:scale(1.07)}
.play svg{width:40px;height:40px;transform:translateX(3px)}
.video-cap{position:absolute;z-index:2;inset-inline-start:36px;bottom:30px;display:flex;align-items:center;gap:16px;color:#fff;font-size:22px;font-weight:700}
.video-cap img{width:120px}
.video-cap span{padding-inline-start:16px;border-inline-start:1px solid rgba(255,255,255,.45)}
.auto{margin-top:24px;align-items:stretch}
.ill{display:grid;place-items:center;padding:28px}
.ill img{width:min(400px,100%)}
.lead{margin-top:12px;font-weight:600;color:var(--ink)}
.auto .ctas{margin-top:30px}

/* features */
.feat{display:flex;flex-direction:column;align-items:center;text-align:center}
.feat .ic{margin-bottom:22px}
.feat h3{text-wrap:balance}
.g4 .feat h3{display:flex;align-items:flex-end;justify-content:center;min-height:3.1em}
.feat p{font-size:15.5px}

/* why */
.why-in,.sol-in{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px}
.why-in{align-items:start}
.why-photo{overflow:hidden;border-radius:16px;background:var(--b6);color:#fff;box-shadow:var(--sh)}
.why-photo img{width:100%;aspect-ratio:390/252;object-fit:cover}
.why-photo p{padding:28px 26px 32px;font-size:20px;line-height:1.75;font-weight:600;text-align:center;text-wrap:balance}
.why-cards .card{padding:28px 26px}
.why-cards h3{display:flex;align-items:flex-end;min-height:3.1em;font-size:18.5px;text-wrap:balance}
.why-cards .chk{font-size:15.5px}
.card-blue{background:linear-gradient(160deg,#527FC0 0%,#3F6DAF 100%);border-color:transparent;color:#fff}
.card-blue h3{color:#fff}
.card-blue .go{margin-top:20px;display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid rgba(255,255,255,.25);font-weight:700}
.card-blue .go svg{width:20px;height:20px;transition:transform .3s var(--ease)}
a.card-blue:hover{border-color:transparent}
a.card-blue:hover .go svg{transform:translateX(-5px)}

/* solutions */
.sol-in{align-items:stretch}
.sol-card{display:flex;flex-direction:column;overflow:hidden;border-radius:16px;padding:48px 28px 0;background:linear-gradient(180deg,#4F7DBE 0%,#3A68AA 100%);color:#fff;box-shadow:var(--sh)}
.sol-card h2{font-size:32px;font-weight:700;text-align:center}
.sol-card p{margin-top:14px;font-size:15.5px;line-height:1.95;text-align:center;color:rgba(255,255,255,.95)}
.sol-card img{width:84%;margin:auto auto 0;padding-top:28px}
.frow{display:flex;align-items:flex-start;gap:22px}
.frow p{margin-top:8px;font-size:15.5px}

/* excellence */
.exc{overflow:hidden;border-radius:16px;background:#fff;border:1px solid rgba(70,117,184,.11);box-shadow:var(--sh)}
.exc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--ln)}
.exc-grid article{padding:34px 32px 36px;background:#fff}
.exc-grid h3{font-size:20px;line-height:1.5;font-weight:700;color:var(--ink)}
.exc-grid p{margin-top:10px;font-size:15.5px}

/* marquee */
.mq{overflow:hidden;padding-block:18px 26px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.mq-track{display:flex;width:max-content}
.mq-set{display:flex}
.mq-set li{flex:none;margin-inline-end:20px}
.tile-logo{display:grid;place-items:center;width:172px;height:124px;border-radius:14px;background:#fff;border:1px solid rgba(70,117,184,.09);box-shadow:var(--sh)}
.tile-logo img{width:128px;height:92px;object-fit:contain}
.client{display:grid;place-items:center;width:200px;height:120px}
.client img{width:auto;height:auto;max-width:150px;max-height:86px}

/* blue band */
.band{position:relative;background:linear-gradient(180deg,#4A79BC 0%,#4675B8 50%,#3F6DAF 100%);color:rgba(255,255,255,.93)}
.stats-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tile{padding:20px 22px 18px;border-radius:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}
.tile dt{font-size:14.5px;color:rgba(255,255,255,.92)}
.tile dd{margin-top:4px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;color:#fff;font-size:28px;line-height:1.25;font-weight:700}
.tile .u{font-size:16px;font-weight:600;color:rgba(255,255,255,.92)}
.tile .pl{font-weight:400;opacity:.85}
.odo{display:inline-flex;direction:ltr;font-variant-numeric:tabular-nums}
.dg{display:inline-block;height:1.25em;overflow:hidden;line-height:1.25em}
.dg>span{display:flex;flex-direction:column}
.dg i{display:block;height:1.25em;line-height:1.25em;font-style:normal}
.d1>span{translate:0 -1.25em}.d2>span{translate:0 -2.5em}.d3>span{translate:0 -3.75em}.d4>span{translate:0 -5em}.d5>span{translate:0 -6.25em}.d6>span{translate:0 -7.5em}.d7>span{translate:0 -8.75em}.d8>span{translate:0 -10em}.d9>span{translate:0 -11.25em}
.dash{overflow:hidden;border-radius:18px;background:#fff;border:6px solid rgba(255,255,255,.22);box-shadow:0 44px 90px -44px rgba(8,22,50,.75)}
.dash img{width:100%}
.glass{display:flex;align-items:flex-start;gap:22px;padding:32px;border-radius:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18)}
.glass h3{font-size:19px;font-weight:700;color:#fff}
.glass p{margin-top:8px;color:rgba(255,255,255,.93)}
.ic-w{background:rgba(255,255,255,.15)}
.ic-w img{filter:brightness(0) invert(1)}
.ic-w svg{width:36px;height:36px;color:#fff}
.sec-band-top{padding-top:96px;padding-bottom:40px}

/* faq */
.faq-sec{background:#fff;padding-block:96px}
.faq{max-width:900px;margin-inline:auto;padding:10px;border-radius:20px;background:#F4F6F9;border:1px solid var(--ln)}
.faq details{border-radius:14px;transition:background-color .3s,box-shadow .3s}
.faq details+details{margin-top:4px}
.faq details[open]{background:#fff;box-shadow:var(--sh)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;min-height:62px;padding:14px 24px;font-size:17px;font-weight:700;color:var(--b7)}
.faq summary::-webkit-details-marker{display:none}
.pm{position:relative;flex:none;width:30px;height:30px;margin-inline-start:auto;border-radius:50%;background:var(--b1)}
.pm::before,.pm::after{content:"";position:absolute;inset:0;margin:auto;width:12px;height:2px;border-radius:2px;background:var(--b6);transition:transform .35s var(--ease)}
.pm::after{transform:rotate(90deg)}
.faq details[open] .pm::after{transform:rotate(0)}
.faq details::details-content{block-size:0;overflow-y:clip;transition:block-size .45s var(--ease),content-visibility .45s allow-discrete}
.faq details[open]::details-content{block-size:auto}
.ans{padding:0 24px 24px}
.ans p+p,.ans p+ul{margin-top:10px}
.ans ul{list-style:disc;padding-inline-start:22px;display:grid;gap:4px}

/* footer */
.ft{background:#fff;border-top:1px solid var(--ln)}
.ft-in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 240px;gap:40px;padding-block:64px 52px}
.ft-col h2{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--ln);font-size:17px;font-weight:700;color:var(--ink)}
.ft-col li a{display:inline-flex;align-items:center;min-height:36px;font-size:15px;transition:color .2s}
.ft-col li a:hover{color:var(--b7)}
.ft-brand{display:flex;flex-direction:column;align-items:center;gap:18px}
.ft-brand img{width:168px}
.soc{display:flex;gap:10px}
.soc a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--b1);color:var(--b6);transition:background-color .2s,color .2s}
.soc a:hover{background:var(--b6);color:#fff}
.soc svg{width:18px;height:18px}
.ft-lic{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:300px;text-align:center}
.ft-lic img{width:170px;height:auto}
.ft-lic p{font-size:13px;line-height:1.8;color:var(--mu)}
.ft-bar{background:#15315A;color:rgba(255,255,255,.88);font-size:13.5px}
.ft-bar-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;min-height:58px;padding-block:10px}
.ft-bar nav{display:flex;gap:20px}
.ft-bar a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.wa-float{position:fixed;z-index:60;bottom:22px;inset-inline-end:22px;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#367D28;color:#fff;box-shadow:0 16px 32px -14px rgba(20,70,10,.8);transition:transform .25s var(--ease)}
.wa-float:hover{transform:scale(1.07)}
.wa-float svg{width:30px;height:30px}

/* hub */
.plats{position:relative;z-index:3;margin-top:-200px;padding-bottom:80px}
.pc{display:flex;flex-direction:column;padding:30px 28px 26px}
.pc h2{display:flex;align-items:flex-end;min-height:3em;margin-top:18px;font-size:21px;line-height:1.5;font-weight:700;color:var(--ink);text-wrap:balance}
.pc .aud{min-height:3.5em;margin-top:4px;font-size:15px;line-height:1.75;color:var(--mu);text-wrap:balance}
.pc .chk{margin-top:18px;padding-top:18px;border-top:1px solid var(--ln);gap:8px;font-size:15px}
.pc .go{margin-top:auto;padding-top:26px;display:flex;align-items:center;justify-content:space-between;font-size:15.5px;font-weight:700;color:var(--b7)}
.pc .go svg{width:20px;height:20px;transition:transform .3s var(--ease)}
a.pc:hover .go svg{transform:translateX(-5px)}
.hub-about{padding-block:8px 0}
.hub-about+.sec{padding-top:88px}

/* services */
.intro{max-width:980px;margin-inline:auto;padding:44px 48px;text-align:center}
.intro h2{font-size:30px;line-height:1.5;font-weight:700;color:var(--ink);text-wrap:balance}
.intro p{margin-top:14px;font-size:16.5px;line-height:2;text-wrap:pretty}
.svc .ic{margin-bottom:20px}
.svc h3{font-size:19.5px}
.svc .chk{gap:8px;font-size:15.5px}
.cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px;padding:40px 44px;border-radius:20px;background:linear-gradient(160deg,#4F7DBE 0%,#3A68AA 100%);color:#fff;box-shadow:var(--shh)}
.cta-band h2{font-size:28px;line-height:1.5;font-weight:700}
.cta-band p{margin-top:6px;color:rgba(255,255,255,.93)}

/* pricing */
.cmp{overflow:clip;border-radius:20px;background:#fff;border:1px solid rgba(70,117,184,.11);box-shadow:var(--sh)}
.pt{width:100%;border-collapse:separate;border-spacing:0;font-size:15.5px}
.pt col.c1{width:31%}
.pt col.cv{width:23%}
.pt th,.pt td{padding:14px 18px;border-bottom:1px solid var(--ln);text-align:center;vertical-align:middle}
.pt thead th{position:sticky;top:72px;z-index:2;padding:26px 14px 22px;background:#fff;border-bottom:1px solid var(--ln);vertical-align:bottom}
.pt thead th.c1{text-align:start;padding-inline-start:28px;font-size:15px;font-weight:600;color:var(--mu)}
.nm{display:block;padding:12px 10px;border-radius:12px;background:#000;color:#fff;font-size:22px;line-height:1.4;font-weight:700}
.plan-basic .nm{background:var(--b6)}
.pr{display:block;margin-top:16px;font-size:14.5px;font-weight:600;color:var(--mu)}
.pr b{display:block;margin-top:2px;font-size:28px;line-height:1.3;font-weight:800;color:var(--ink)}
.pr b small{font-size:15px;font-weight:600;color:var(--mu)}
.pt tbody th{padding-inline-start:28px;text-align:start;font-weight:600;color:var(--ink)}
.pt .grp th{padding-block:12px;background:#F4F7FB;color:var(--b7);font-size:15px;font-weight:700}
.pt .sub th{padding-inline-start:52px;font-weight:500;color:var(--tx)}
.pt tbody tr:last-child th,.pt tbody tr:last-child td{border-bottom:0}
.pt tbody tr:not(.grp):hover>*{background:#F9FAFC}
.v-free,.v-no{color:var(--mu)}
.v-gift,.v-yes{color:var(--b7);font-weight:700}
.v-pay{color:var(--ink);font-weight:700}
.v-pay small,.v-gift small{font-weight:500;color:var(--mu)}
/* a price still to be filled in */
.tbd{display:inline-block;padding:1px 10px;border-radius:8px;border:1px dashed rgba(70,117,184,.5);background:#F6F8FC;color:var(--b7);font-size:14px;font-weight:700;line-height:1.7}
.pr b .tbd{font-size:17px;line-height:1.6}
.notes{margin-top:28px;padding:28px 32px;border-radius:16px;background:#fff;border:1px solid var(--ln)}
.notes strong{color:var(--ink)}
.notes ol{margin-top:12px;display:grid;gap:6px;font-size:14.5px;line-height:1.85}
.plans-cta{margin-top:36px;justify-content:center}

/* service groups (tabs) */
.svc-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;width:fit-content;max-width:100%;margin:0 auto 32px;padding:6px;border-radius:16px;background:#fff;border:1px solid var(--ln);box-shadow:var(--sh)}
.svc-tabs button{min-height:48px;padding-inline:22px;border:0;border-radius:11px;background:transparent;font:inherit;font-size:15.5px;font-weight:700;color:var(--tx);cursor:pointer;transition:background-color .25s,color .25s}
.svc-tabs button:hover{background:var(--b1);color:var(--b7)}
.svc-tabs button[aria-selected="true"]{background:var(--b6);color:#fff}
.tab-1 .svc:not(.in-g1),.tab-2 .svc:not(.in-g2),.tab-3 .svc:not(.in-g3),.tab-4 .svc:not(.in-g4){display:none}

/* plan switch (phones) */
.plan-tabs{display:none}

/* shared pages: shareholders' platform, partners, clients, news, contact, policies */
.tool{display:flex;flex-direction:column;scroll-margin-top:156px}
.tool .ic{margin-bottom:20px}
.tool h2{font-size:22px;line-height:1.55;font-weight:700;color:var(--ink);text-wrap:balance}
.tool p{margin-top:8px}
.tool-row{display:flex;gap:10px;margin-top:auto;padding-top:22px}
.inp{flex:1;min-width:0;height:52px;padding-inline:16px;border:1px solid #CFD8E5;border-radius:10px;background:#fff;font:inherit;font-size:16px;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.inp::placeholder{color:#80868F}
.inp:focus{outline:none;border-color:var(--b6);box-shadow:0 0 0 3px rgba(70,117,184,.2)}
.tool-row .btn{flex:none;min-width:112px}
.apps{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px 48px;align-items:end;overflow:hidden;padding:48px 52px 0}
.apps-txt{align-self:center;padding-bottom:48px}
.apps-txt h3{margin-top:30px;padding-top:24px;border-top:1px solid var(--ln);font-size:17px;font-weight:700;color:var(--ink)}
.app-tile{display:inline-grid;place-items:center;margin-top:14px;width:220px;height:100px;border-radius:14px;background:#fff;border:1px solid var(--ln);transition:box-shadow .35s var(--ease),transform .35s var(--ease),border-color .35s}
.app-tile img{width:170px}
.app-tile:hover{transform:translateY(-4px);box-shadow:var(--shh);border-color:rgba(70,117,184,.3)}
.apps-ph{width:300px;margin-bottom:-6px}
.cl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.cl{display:grid;place-items:center;min-height:170px;padding:24px;border-radius:16px;background:#fff;border:1px solid rgba(70,117,184,.11);box-shadow:var(--sh)}
.cl img{width:auto;height:auto;max-width:min(170px,100%);max-height:104px}
/* every client card expands while the pointer is on it and settles back when it leaves (Aziz 2026-10-12) */
.cl{position:relative;transition:box-shadow .45s var(--ease),transform .45s var(--ease),border-color .45s}
.cl img{transition:transform .45s var(--ease)}
.cl:hover,.cl:focus-visible{z-index:2;transform:scale(1.08);box-shadow:var(--shh);border-color:rgba(70,117,184,.3)}
.cl:hover img,.cl:focus-visible img{transform:scale(1.06)}
@media (prefers-reduced-motion:reduce){.cl,.cl img{transition:none}.cl:hover,.cl:focus-visible,.cl:hover img,.cl:focus-visible img{transform:none}}
.cl-feat{grid-column:span 2;display:flex;align-items:center;gap:26px;place-items:initial}
.cl-feat img{flex:none;max-width:150px}
.cl-feat h3{font-size:18px;line-height:1.6;font-weight:700;color:var(--ink)}
.cl-feat p{margin-top:6px;font-size:15px;line-height:1.85}
.news-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px}
.news-bar .svc-tabs{margin:0}
.srch{display:flex;gap:8px;flex:1 1 360px;max-width:480px}
.news-list{display:grid;gap:18px}
.show-1 .nw-st,.show-2 .nw-an{display:none}
.nw{display:grid;grid-template-columns:132px minmax(0,1fr);gap:28px;align-items:center}
.nw-logo{display:grid;place-items:center;width:132px;height:100px;border-radius:14px;background:#fff;border:1px solid var(--ln)}
.nw-logo img{max-width:104px;max-height:70px;width:auto;height:auto}
.nw-logo .ic{width:56px;height:56px;border-radius:16px}
.nw-logo .ic img{width:32px;height:32px}
.nw h2{font-size:18.5px;line-height:1.6;font-weight:700;color:var(--ink);text-wrap:pretty}
.nw p{margin-top:6px}
.nw-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-top:12px;font-size:14.5px;color:var(--mu)}
.nw-meta .lk{font-size:15px}
.files{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.file{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding-inline:14px;border-radius:10px;background:var(--b1);color:var(--b7);font-size:14.5px;font-weight:700;transition:background-color .2s,color .2s}
.file svg{width:18px;height:18px}
.file:hover{background:var(--b6);color:#fff}
.tag{display:inline-flex;align-items:center;min-height:28px;padding-inline:10px;border-radius:999px;background:#F1F4F8;font-size:13.5px;font-weight:600;color:var(--tx)}
.nw-empty{padding:36px;text-align:center;color:var(--mu)}
.ct-intro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px;margin-bottom:24px}
.ct-intro h2{max-width:760px;font-size:24px;line-height:1.7;font-weight:700;color:var(--ink);text-wrap:balance}
.ct-intro p{margin-top:8px}
.ct-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.ct-card{display:flex;flex-direction:column;align-items:flex-start}
.ct-card .ci{display:grid;place-items:center;width:56px;height:56px;margin-bottom:18px;border-radius:16px;background:var(--b1);color:var(--b6);transition:background-color .35s var(--ease),color .35s}
.ct-card .ci svg{width:26px;height:26px}
.ct-card .ci .glyph{width:26px;height:26px}
.ct-card h2{font-size:15.5px;font-weight:600;color:var(--mu)}
.ct-map{margin-top:24px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.ct-map h2{font-size:22px;font-weight:700;color:var(--ink)}
.ct-map iframe{display:block;width:100%;height:380px;border:0;border-radius:16px;background:var(--b1)}
@media (max-width:720px){.ct-map iframe{height:280px}}
.ct-card .v{margin-top:4px;font-size:19px;line-height:1.5;font-weight:700;color:var(--ink)}
.ct-card .v span{display:block;white-space:nowrap}
a.ct-card:hover .ci{background:var(--b6);color:#fff}
.doc-wrap{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;align-items:start}
.toc{position:sticky;top:152px;padding:20px 16px;border-radius:16px;background:#fff;border:1px solid var(--ln);box-shadow:var(--sh)}
.toc h2{margin-bottom:8px;padding-inline:10px;font-size:14.5px;font-weight:700;color:var(--mu)}
.toc ol{display:grid;gap:2px;max-height:calc(100vh - 230px);overflow:auto;overscroll-behavior:contain}
.toc a{display:block;padding:6px 10px;border-radius:8px;font-size:14.5px;line-height:1.65;transition:background-color .2s,color .2s}
.toc a:hover{background:var(--b1);color:var(--b7)}
.doc{padding:46px 54px}
.doc-solo{max-width:920px;margin-inline:auto}
.doc h2{margin-top:38px;font-size:21px;line-height:1.6;font-weight:700;color:var(--ink);scroll-margin-top:156px}
.doc h2:first-child{margin-top:0}
.doc p{margin-top:12px;font-size:16.5px;line-height:2.05;text-wrap:pretty}
.doc .lead{margin-top:0;font-size:18px;line-height:1.95;font-weight:600;color:var(--ink)}
.doc ul{margin-top:12px;list-style:disc;padding-inline-start:24px;display:grid;gap:6px;font-size:16.5px;line-height:1.95}
.doc ul+p{margin-top:14px}


/* responsive */
@media (max-width:1180px){
 .nav{margin-inline-start:4px}
 .nav a,.acts a{padding-inline:9px;font-size:15px}
}
@media (max-width:1080px){
 .nav,.acts{display:none}
 .mnav{display:block}
 .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .why-in,.sol-in,.stats-in{grid-template-columns:minmax(0,1fr)}
 .why-photo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
 .sol-card{padding-bottom:0}
 .sol-card img{width:min(320px,70%)}
 .exc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ft-in{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .ct-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .doc-wrap{grid-template-columns:minmax(0,1fr)}
 .toc{display:none}
 .apps{grid-template-columns:minmax(0,1fr) 240px;padding:40px 36px 0}
 .apps-ph{width:240px}
}
@media (max-width:720px){
 .w{padding-inline:16px}
 .sw-bar{position:relative;height:56px;animation:none}
 .sw,.sw .th,.sw a[aria-current]{animation:none}
 .sw-in{padding-inline:12px}
 .sw{width:100%}
 .sw a{flex:1 1 auto;min-height:38px;padding-inline:8px;font-size:13px}
 .hd{top:0;height:68px;animation-range:56px 196px}
 .hd .lg-d{animation-range:86px 131px}
 .hd .lg-l{animation-range:131px 166px}
 .hero{margin-top:-124px}
 .logo{width:120px;height:38px}
 .hero-in{min-height:640px;padding-block:150px 104px}
 .hero-t{font-size:38px;line-height:1.35}
 .hero-s{font-size:17.5px}
 .hero-hub .hero-in{min-height:616px;padding-block:176px 170px}
 .hero-sm .hero-in{min-height:320px;padding-block:150px 44px}
 .hero-sm .hero-t{font-size:38px}
 .sec{padding-block:64px}
 .sec-band-top{padding-top:64px}
 .sh{margin-bottom:28px}
 .sh h2{font-size:27px}
 .g2,.g3,.g4{grid-template-columns:minmax(0,1fr);gap:18px}
 .card{padding:24px}
 .ct{font-size:20px}
 .why-photo{display:block}
 .frow{gap:16px}
 .frow .ic{width:54px;height:54px;border-radius:15px}
 .frow .ic img{width:32px;height:32px}
 .exc-grid{grid-template-columns:minmax(0,1fr)}
 .exc-grid article{padding:26px 24px}
 .tiles{grid-template-columns:minmax(0,1fr)}
 .tile dd{font-size:28px}
 .glass{padding:24px;gap:16px}
 .video-cap{inset-inline-start:20px;bottom:16px;font-size:16px}
 .video-cap img{width:84px}
 .play{width:72px;height:72px}
 .play svg{width:30px;height:30px}
 .faq summary{padding:12px 16px;font-size:16px}
 .ans{padding:0 16px 18px}
 .ft-in{grid-template-columns:minmax(0,1fr);gap:28px;padding-block:48px 40px}
 .ft-brand{align-items:flex-start}
 .ft-lic{align-items:flex-start;text-align:start}
 .ft-bar-in{justify-content:center;text-align:center}
 .plats{margin-top:-140px;padding-bottom:56px}
 .intro{padding:30px 22px}
 .intro h2{font-size:24px}
 .cta-band{padding:30px 24px}
 .cta-band h2{font-size:23px}
 .pt{font-size:14.5px}
 .pt thead th{position:static}
 .pt th,.pt td{padding:12px 12px}
 .nm{font-size:18px}
 .pr b{font-size:22px}
 .notes{padding:22px 20px}
 .pc h2,.pc .aud,.g4 .feat h3,.why-cards h3{min-height:0}
 .why-photo{order:2}
 .ft-bar-in{padding-bottom:84px}
 .svc-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
 .svc-tabs button{padding-inline:10px;font-size:14.5px;line-height:1.4}
 .plan-tabs{display:flex;gap:6px;margin-bottom:14px;padding:6px;border-radius:14px;background:#fff;border:1px solid var(--ln);box-shadow:var(--sh)}
 .plan-tabs button{flex:1;min-height:46px;border:0;border-radius:10px;background:transparent;font:inherit;font-size:15px;font-weight:700;color:var(--tx);cursor:pointer}
 .plan-tabs button[aria-pressed="true"]{background:var(--b6);color:#fff}
 .cmp{overflow:clip}
 .pt{min-width:0}
 .pt col.c1,.pt col.cv{width:auto}
 .show-1 .pt :is(thead th,tbody td):nth-child(3),.show-1 .pt :is(thead th,tbody td):nth-child(4),
 .show-2 .pt :is(thead th,tbody td):nth-child(2),.show-2 .pt :is(thead th,tbody td):nth-child(4),
 .show-3 .pt :is(thead th,tbody td):nth-child(2),.show-3 .pt :is(thead th,tbody td):nth-child(3){display:none}
 .pt thead th:not(.c1){width:52%}
 .tile-logo{width:140px;height:104px}
 .tile-logo img{width:104px;height:76px}
 .client{width:160px;height:100px}
 .cl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .cl{min-height:128px;padding:18px}
 .cl img{max-height:80px}
 .cl-feat{flex-direction:column;align-items:flex-start;gap:14px}
 .cl-feat img{max-width:120px}
 .tool-row .btn{min-width:96px;padding-inline:18px}
 .tool{scroll-margin-top:84px}
 .apps{grid-template-columns:minmax(0,1fr);padding:28px 22px 0}
 .apps-txt{padding-bottom:0}
 .apps-ph{width:220px;margin-inline:auto}
 .news-bar{flex-direction:column;align-items:stretch}
 .news-bar .svc-tabs{width:100%}
 .srch{max-width:none;flex-basis:auto}
 .nw{grid-template-columns:minmax(0,1fr);gap:16px}
 .nw-logo{width:96px;height:72px}
 .nw-logo img{max-width:76px;max-height:52px}
 .ct-intro h2{font-size:21px}
 .ct-grid{grid-template-columns:minmax(0,1fr);gap:14px}
 .doc{padding:28px 20px}
 .doc h2{margin-top:30px;font-size:19px;scroll-margin-top:84px}
 .doc p,.doc ul{font-size:16px;line-height:2}
}
.sar{display:inline-block;width:.82em;height:.82em;vertical-align:-.06em;fill:currentColor}
.tile .na{font-weight:400;opacity:.7}
.tile[data-stat="aum"]{grid-column:1/-1}
.q-dlg{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px;background:rgba(10,24,48,.55)}
.q-dlg[hidden]{display:none}
.q-box{position:relative;width:min(460px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:32px 28px 26px;border-radius:20px;background:#fff;box-shadow:0 30px 80px rgba(8,22,46,.35)}
.q-box h2{font-size:22px;font-weight:800;color:var(--ink)}
.q-box label{display:block;margin-top:18px;font-size:15px;font-weight:600;color:var(--tx)}
.q-box .inp{width:100%;margin-top:8px}
.q-err{margin-top:8px;font-size:14px;color:#C0392B}
.q-box .ctas{margin-top:22px;flex-wrap:wrap}
.q-x{position:absolute;inset-inline-end:14px;top:12px;width:36px;height:36px;border:0;border-radius:10px;background:#F1F4F8;font-size:22px;line-height:1;color:var(--tx);cursor:pointer}
.btn-q{cursor:pointer;font:inherit;border:0}
.btn-l{color:var(--b7);background:#fff;box-shadow:inset 0 0 0 1.5px var(--b6)}
.btn-l:hover{background:var(--b1)}
/* clients slider: bigger logos, closer together (Aziz 2026-10-12) */
.client{width:auto;height:120px}
.client img{max-width:210px;max-height:100px}
.mq-set li:has(.client){margin-inline-end:44px}
@media (max-width:720px){.client{height:96px}.client img{max-width:160px;max-height:80px}.mq-set li:has(.client){margin-inline-end:28px}}
/* ---- 2026-10-12 round (Aziz): illustrated heroes, client cards, plans table, statement card, footer bar ---- */
.ft-bar-in{justify-content:center;text-align:center}
.hero.hero-art::before{background:linear-gradient(270deg,rgba(9,24,48,.62) 0%,rgba(9,24,48,.30) 38%,rgba(9,24,48,0) 62%)}
.hero-art .hero-bg{background:#15315A}
.hero-art .hero-bg img{object-position:0% 100%!important;animation:none}
/* clients: a logo card; on hover/focus it grows and opens the client's details */
.cl-grid{align-items:start}
.cl{display:block;min-height:0;padding:0;border:0;background:none;box-shadow:none;position:relative;height:170px}
.cl-in{position:absolute;inset:0 0 auto 0;min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:24px;border-radius:16px;background:#fff;border:1px solid rgba(70,117,184,.11);box-shadow:var(--sh);transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s,gap .45s var(--ease)}
.cl-in img{width:auto;height:auto;max-width:min(170px,100%);max-height:104px;transition:transform .45s var(--ease)}
.cl-info{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .45s var(--ease),opacity .35s;text-align:center}
.cl-info>div{overflow:hidden}
.cl-info h3{font-size:16.5px;line-height:1.6;font-weight:700;color:var(--ink)}
.cl-info p{margin-top:6px;font-size:14px;line-height:1.85;color:var(--tx);text-align:start}
.cl:hover,.cl:focus-within{z-index:3}
.cl:hover,.cl:focus-visible{transform:none;box-shadow:none;border-color:transparent}
.cl:hover .cl-in img,.cl:focus-within .cl-in img{transform:none}
.cl:hover .cl-in,.cl:focus-within .cl-in{transform:scale(1.06);gap:14px;box-shadow:var(--shh);border-color:rgba(70,117,184,.3)}
.cl:hover .cl-info,.cl:focus-within .cl-info{grid-template-rows:1fr;opacity:1}
.cl a.cl-in{color:inherit;text-decoration:none}
.cl:focus-within .cl-in{outline:2px solid var(--b6);outline-offset:2px}
@media (hover:none){.cl{height:auto}.cl-in{position:relative;gap:12px}.cl-info{grid-template-rows:1fr;opacity:1}.cl-info p{display:none}}
@media (prefers-reduced-motion:reduce){.cl-in,.cl-in img,.cl-info{transition:none}.cl:hover .cl-in,.cl:focus-within .cl-in{transform:none}}
/* plans: groups read as one block; values read at a glance */
.pt .grp th{padding-block:14px;background:#EEF3FA;color:var(--b7);font-size:15.5px;font-weight:800;border-inline-start:4px solid var(--b6)}
.pt tr.sub>th,.pt tr.sub>td{background:#F7F9FD}
.pt tr.sub>th{position:relative;padding-inline-start:58px}
.pt tr.sub>th::before{content:"";position:absolute;inset-inline-start:32px;top:0;bottom:50%;width:14px;border-inline-start:2px solid #B9CBE6;border-bottom:2px solid #B9CBE6;border-end-start-radius:8px}
.pt tr.sub-end>th,.pt tr.sub-end>td{border-bottom:2px solid #D5E0F0}
.pt tbody tr.sub:hover>*{background:#EFF4FB}
.v-free{color:var(--mu);font-weight:500}
.v-free::before{content:"";display:inline-block;width:15px;height:15px;margin-inline-end:6px;vertical-align:-2px;background:url("../../assets/check-blue.svg") center/contain no-repeat;opacity:.55}
td.v-gift{font-weight:700}
.v-gift>span{display:inline-block;padding:5px 12px;border-radius:999px;background:#E8F0FB;color:var(--b7);line-height:1.5}
.v-pay .ltr{font-size:16.5px}
.pt thead th:not(.c1){border-inline-start:1px solid var(--ln)}
.pt tbody td{border-inline-start:1px solid var(--ln)}
.plans-cta .btn{min-width:220px;justify-content:center}
/* financial statement card: logo and company name side by side */
.news-list .nw.nw-st{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"files head";align-items:center;gap:28px}
.news-list.show-1 .nw.nw-st,.news-list.show-2 .nw.nw-an{display:none}
.nw-st .st-head{grid-area:head;direction:ltr}
.nw-st .st-head .nw-meta{direction:ltr}
.st-head{display:flex;align-items:center;gap:18px}
.st-logo{flex:none;display:grid;place-items:center;width:76px;height:76px;border-radius:18px;background:#fff;border:1px solid var(--ln);box-shadow:0 6px 18px rgba(31,63,115,.08);overflow:hidden}
.st-logo img{max-width:60px;max-height:52px;width:auto;height:auto}
.st-logo.mono{background:linear-gradient(150deg,var(--b6),var(--b7));border:0;color:#fff;font-size:30px;font-weight:800;line-height:1}
.st-head h2{font-size:20px;line-height:1.5;font-weight:800;color:var(--ink);text-align:left;unicode-bidi:plaintext}
.st-head .nw-meta{margin-top:8px}
.nw-st .files{grid-area:files;margin:0;justify-content:flex-start}
@media (max-width:720px){.news-list .nw.nw-st{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "files";gap:16px}}
@media (max-width:720px){.hero-art .hero-bg img{object-position:100% 100%!important}}
@media (max-width:720px){.st-logo{width:60px;height:60px;border-radius:14px}.st-logo img{max-width:46px;max-height:40px}.st-head h2{font-size:18px}}
/* ---- 2026-10-12 refinement (Aziz: «enhance the cards (not design) font just and any 2 rows can be 1») ---- */
.card h3{font-size:17px}
.why-cards h3{font-size:16px}
.why-cards .chk{font-size:14px}
.cl-info h3{font-size:14.5px}
.pc .chk{font-size:14.5px}
.hero-s{max-width:900px}
.sol-card img.sol-ph{width:92%;filter:drop-shadow(0 18px 28px rgba(8,24,52,.35))}
/* Securities and Listed: coming soon (Aziz 2026-10-12) */
.sw a.soon{cursor:default}
.sw a.soon .lb{opacity:.62}
.sw a.soon:hover{background:none}
.sw a.soon{position:relative;overflow:visible}
.soon-b{position:absolute;top:-7px;inset-inline-end:-2px;z-index:2;padding:0 7px;border-radius:999px;background:#D93025;color:#fff;font-size:10px;font-weight:700;line-height:17px;letter-spacing:0;box-shadow:0 3px 8px -3px rgba(150,20,10,.6)}
.msw a.soon{opacity:.6;pointer-events:none}
.pc.soon{position:relative;cursor:default}
.pc.soon:hover{transform:none;box-shadow:var(--sh)}
.pc.soon .ic,.pc.soon h2,.pc.soon .aud,.pc.soon .chk{opacity:.55}
.pc .soon-tag{position:absolute;top:22px;inset-inline-end:22px;padding:3px 14px;border-radius:999px;background:#D93025;color:#fff;font-size:13.5px;font-weight:700;line-height:1.7}
.pc.soon .go{color:var(--mu)}
@media (max-width:720px){
 .card h3{font-size:17px}
 .faq summary{font-size:15px}
 .pt th{font-size:13px}
 .svc-tabs button{font-size:13.5px}
 .sh h2{font-size:25px}
 .chk li{font-size:15px}
 .hero-t{font-size:36px}
 .soon-b{top:-6px;padding:0 5px;font-size:9px;line-height:15px}
}
/* tour: real platform screens in device frames (2026-10-12) */
.devs{position:relative;max-width:1040px;margin:0 auto 40px}
.lap{width:84%;margin-inline-start:auto}@media (max-width:1180px){.lap{margin-inline-end:6%}}
.lap-scr{aspect-ratio:1440/880;overflow:hidden;border:12px solid #1C2433;border-bottom-width:16px;border-radius:22px 22px 4px 4px;background:#fff}
.lap-scr video,.ph-scr video{display:block;width:100%;height:100%;object-fit:cover}
.lap-base{position:relative;height:18px;margin-inline:-7%;border-radius:2px 2px 20px 20px;background:linear-gradient(180deg,#E3E8F0,#A9B4C5);box-shadow:0 34px 50px -30px rgba(8,22,50,.55)}
.lap-base::before{content:"";position:absolute;top:0;left:50%;width:16%;height:7px;transform:translateX(-50%);border-radius:0 0 10px 10px;background:#B9C3D2}
.phone{position:absolute;inset-inline-start:0;bottom:-34px;width:23%;padding:8px;border-radius:40px;background:#1C2433;box-shadow:0 34px 60px -26px rgba(8,22,50,.6)}
.ph-scr{aspect-ratio:390/844;overflow:hidden;border-radius:32px;background:#fff}
.dash-bw{border:0;border-radius:14px}
.bw-bar{display:flex;gap:7px;padding:11px 14px;background:#E9EEF5}
.bw-bar i{width:11px;height:11px;border-radius:50%;background:#C3CCD9}
.bw-bar i:first-child{background:#F26B5E}.bw-bar i:nth-child(2){background:#F5BF4F}.bw-bar i:nth-child(3){background:#5BC466}
@media (max-width:720px){.devs{margin:28px auto 30px}.lap{width:86%}.lap-scr{border-width:7px 7px 10px;border-radius:12px 12px 3px 3px}.lap-base{height:11px}.phone{width:30%;padding:5px;border-radius:24px;bottom:-24px}.ph-scr{border-radius:19px}}
/* «حفظ في أرقام»: several real screens stacked (Aziz 2026-10-12: «i want multiple screens here») */
.scr-stack{position:relative;aspect-ratio:1/1.02;width:100%}
.scr-stack .bw{position:absolute;width:82%;overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 30px 60px -28px rgba(8,22,50,.7)}
.scr-stack .bw img{display:block;width:100%}
.scr-stack .s1{top:0;inset-inline-end:0;opacity:.9;transform:scale(.92);transform-origin:top left}
.scr-stack .s2{top:24%;inset-inline-start:0}
.scr-stack .s3{top:50%;inset-inline-end:2%}
.scr-stack .phone{position:absolute;inset-inline-start:2%;bottom:0;width:22%;padding:6px;border-radius:30px}
.scr-stack .ph-scr img{display:block;width:100%;height:100%;object-fit:cover}
.scr-stack .ph-scr{border-radius:24px}
@media (max-width:720px){.scr-stack .bw{border-radius:9px}.scr-stack .bw-bar{padding:7px 9px;gap:5px}.scr-stack .bw-bar i{width:7px;height:7px}.scr-stack .phone{padding:4px;border-radius:18px}.scr-stack .ph-scr{border-radius:14px}}
/* section intros on one line on wide screens (Aziz 2026-10-12: «one line») */
@media (min-width:1081px){.sh p{max-width:none}}
/* economy plan colour (Aziz 2026-10-12) */
.plan-eco .nm{background:#15315A}
/* verify tools popup (Aziz 2026-10-12) */
.t-box{width:min(620px,100%)}
.t-body{margin-top:14px;font-size:16px;line-height:1.9;color:var(--tx)}
.t-body ul{margin-top:10px;display:grid;gap:8px}
.t-body li{padding:10px 14px;border-radius:10px;background:var(--b1);color:var(--ink);font-weight:600}
.t-ok{color:#1E7B45;font-weight:700}
.t-bad{color:#B3261E;font-weight:700}
.t-pdf{display:block;width:100%;height:min(60vh,520px);margin-top:14px;border:1px solid var(--ln);border-radius:12px;background:#F4F7FB}
.t-box .ctas{margin-top:16px}
/* card paragraphs justified (Aziz 2026-10-12) */
.exc-grid p,.frow p,.why-cards li,.card.tool p,.about .card p,.hub-about .card p{text-align:justify}
/* the number typed in the verify boxes sits in the middle (Aziz 2026-10-12) */
.tool .inp{text-align:center}
/* the longer switch names fit a phone: smaller type, and a name may take two short lines (Aziz 2026-10-12 names) */
@media (max-width:720px){.sw{width:100%;max-width:520px}.sw a{flex:1 1 0;min-width:0;padding-inline:6px;font-size:12px;line-height:1.2;white-space:normal;text-align:center}}
/* English pages (left to right) */
.hf[dir="ltr"] .arr{transform:scaleX(-1)}
/* sliders run the other way in English so the two copies join without a gap (Aziz 2026-10-12) */
.hf[dir="ltr"] .mq-track{animation-name:mqL}
@keyframes mqL{to{translate:-50% 0}}
/* financial statement card mirrored in English: logo and name first, files at the end */
.hf[dir="ltr"] .news-list .nw.nw-st{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"head files"}
.hf[dir="ltr"] .nw-st .files{justify-content:flex-end}
/* English: no justified text (it leaves wide gaps in English), the hero title on one line, the riyal symbol before the number */
.hf[dir="ltr"] .exc-grid p,.hf[dir="ltr"] .frow p,.hf[dir="ltr"] .why-cards li,.hf[dir="ltr"] .card.tool p,.hf[dir="ltr"] .about .card p,.hf[dir="ltr"] .hub-about .card p{text-align:start}
.hf[dir="ltr"] .hero-t{max-width:none;text-wrap:balance}
.hf[dir="ltr"] .tile dd .pl{order:-2}
.hf[dir="ltr"] .tile dd .u:has(.sar){order:-1}
/* the YouTube video plays in place once pressed (Aziz 2026-10-12) */
.video iframe{position:absolute;inset:0;z-index:3;width:100%;height:100%;border:0}
/* English: the illustrated heroes use a version drawn with the art on the right, opposite the title */
.hf[dir="ltr"] .hero-art .hero-bg img{object-position:0% 100%!important}
@media (max-width:720px){.hf[dir="ltr"] .news-list .nw.nw-st{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "files"}.hf[dir="ltr"] .nw-st .files{justify-content:flex-start}}
@media (prefers-reduced-motion:reduce){
 .mq{-webkit-mask-image:none;mask-image:none}
 .mq-track{width:auto}
 .mq-set{flex-wrap:wrap;justify-content:center;row-gap:20px;margin-inline:auto;max-width:1188px}
 .mq-set[aria-hidden="true"]{display:none}
 .hf *{transition:none!important}
}

.nw-full{align-items:start}.nw-body{margin-top:18px;line-height:1.9}.nw-body p,.nw-body div{margin:0 0 12px}.nw-body ul,.nw-body ol{margin:0 0 12px;padding-inline-start:22px}.nw-body a{color:var(--b7);text-decoration:underline}