/* Tadbir website. Spacing scale: 8 / 16 / 24 / 40 / 64 / 96 / 128 */
@font-face{font-family:Rubik;src:url(/assets/fonts/rubik-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Rubik;src:url(/assets/fonts/rubik-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Rubik;src:url(/assets/fonts/rubik-600.woff2) format("woff2");font-weight:600 700;font-display:swap}
:root{--teal:#0C7F5E;--deep:#0A5C4B;--mint:#3DDC84;--bg:#F3F8F5;--tile:#E8F1EC;--ink:#0F1F1A;--mute:#55675F;--line:#DDE9E2;--dark:#0F1A17;color-scheme:light}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Rubik,system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:6px}
.skip{position:absolute;inset-inline-start:16px;top:-60px;background:var(--ink);color:#fff;padding:8px 16px;border-radius:8px;z-index:10}
.skip:focus{top:8px}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}

/* header */
header{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:20px;color:var(--deep);text-decoration:none}
.logo img{width:30px;height:30px;border-radius:8px}
.mainnav{display:none;gap:32px;font-size:15px}
.mainnav a{text-decoration:none}.mainnav a:hover{color:var(--teal)}
.hr{display:flex;gap:16px;align-items:center;font-size:14px}
.lang{text-decoration:none;color:var(--ink)}
.pill{background:var(--teal);color:#fff;border-radius:999px;padding:9px 20px;font-weight:500;display:inline-flex;gap:8px;align-items:center;text-decoration:none;font-size:14px;border:1.5px solid var(--teal)}
.pill:hover{background:var(--deep);border-color:var(--deep)}
.pill.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.pill.ghost:hover{background:var(--ink);color:#fff}

/* platform: html[data-os=ios|and] is set by /assets/os.js */
[data-os=ios] .only-and,[data-os=and] .only-ios{display:none!important}

/* hero */
.hero{display:grid;gap:40px;padding:24px 0 8px;align-items:center}
h1{font-size:46px;line-height:1.1;font-weight:500;letter-spacing:-.03em;margin-top:8px}
h2{font-size:36px;line-height:1.15;font-weight:500;letter-spacing:-.025em}
[dir=rtl] h1,[dir=rtl] h2{letter-spacing:0;line-height:1.25}
.lead{color:#3B4945;margin-top:16px;font-size:17px;max-width:470px}
.actions{display:flex;gap:12px 16px;margin-top:24px;flex-wrap:wrap;align-items:center}
.small{font-size:13.5px;color:var(--mute);margin-top:16px}
.alt{font-size:14px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#9CC3B2}
.badge{display:inline-flex;align-items:center;gap:10px;background:#000;color:#fff;border-radius:14px;padding:10px 18px 10px 16px;min-width:172px;height:56px;text-decoration:none}
.badge:hover{background:#1d2a26}
.badge svg{width:24px;height:24px;flex:none;fill:#fff}
.badge small{display:block;font-size:11px;opacity:.8;line-height:1.15}
.badge b{display:block;font-size:18px;font-weight:600;line-height:1.2}
.actions .badge.second{display:none}
[data-os=and] .stores .b-ios{order:2}
.visual{position:relative;display:flex;justify-content:center;padding:24px 0 8px}
.bubble,.txn{position:absolute;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(15,31,26,.12);font-size:12px;line-height:1.5;z-index:3}
.bubble{top:64px;inset-inline-end:0;padding:10px 14px;max-width:200px}
[dir=rtl] .bubble{border-top-left-radius:4px}[dir=ltr] .bubble{border-top-right-radius:4px}
.bubble .from{font-weight:600;color:var(--teal)}
.bubble .time{color:var(--mute);font-size:10px;text-align:end}
.txn{bottom:96px;inset-inline-start:0;padding:10px 14px;display:flex;gap:10px;align-items:center;min-width:210px}
.txn .e{width:34px;height:34px;border-radius:50%;background:#FDEBD8;display:grid;place-items:center;font-size:17px}
.txn b{display:block;font-size:13.5px;font-weight:600}
.txn .amt{margin-inline-start:auto;font-weight:600;font-size:14px;direction:ltr}
.txn .ok{position:absolute;top:-9px;inset-inline-end:-9px;width:22px;height:22px;border-radius:50%;background:var(--mint);color:#fff;display:grid;place-items:center;font-size:12px}

/* devices */
.dev{position:relative;width:var(--w);flex:none}
.dev .frame{position:relative;width:100%;aspect-ratio:var(--ar)}
.dev .glass{position:absolute;overflow:hidden;background:#F4F8F7;display:flex;flex-direction:column}
.dev .glass img{width:100%;display:block;height:auto}
.dev .sb{flex:none;display:flex;align-items:center;justify-content:space-between;color:#111;font-weight:600;direction:ltr}
.dev .sb svg{fill:currentColor;display:block}
.dev .sb .r{display:flex;gap:4px;align-items:center}
.dev .k{position:absolute;border-radius:2px}
@media (prefers-color-scheme:dark){.dev .glass{background:#0E1615}.dev .sb{color:#fff}}
.ios{--ar:402/874}
.ios .frame{border-radius:calc(var(--w)*.165);background:linear-gradient(135deg,#E9E6E1 0%,#A7A39C 18%,#EDEAE5 40%,#8F8B84 70%,#D6D2CB 100%);box-shadow:0 50px 90px -30px rgba(15,31,26,.45),inset 0 0 0 1px rgba(255,255,255,.6)}
.ios .frame::before{content:"";position:absolute;inset:calc(var(--w)*.014);border-radius:calc(var(--w)*.152);background:#050505}
.ios .glass{inset:calc(var(--w)*.036);border-radius:calc(var(--w)*.13)}
.ios .island{position:absolute;top:calc(var(--w)*.058);left:50%;transform:translateX(-50%);width:31%;height:calc(var(--w)*.088);background:#000;border-radius:999px;z-index:2}
.ios .sb{height:calc(var(--w)*.15);padding:calc(var(--w)*.02) calc(var(--w)*.085) 0;font-size:calc(var(--w)*.05)}
.ios .k{background:linear-gradient(90deg,#8F8B84,#D6D2CB);width:calc(var(--w)*.011)}
.ios .k.l{left:calc(var(--w)*-.009)}.ios .k.r{right:calc(var(--w)*-.009)}
.and{--ar:400/862}
.and .frame{border-radius:calc(var(--w)*.075);background:linear-gradient(180deg,#5E6166,#3A3C40 50%,#55585D);box-shadow:0 50px 90px -30px rgba(15,31,26,.45),inset 0 0 0 1px rgba(255,255,255,.18)}
.and .frame::before{content:"";position:absolute;inset:calc(var(--w)*.01);border-radius:calc(var(--w)*.066);background:#020202}
.and .glass{inset:calc(var(--w)*.026);border-radius:calc(var(--w)*.05)}
.and .hole{position:absolute;top:calc(var(--w)*.05);left:50%;transform:translateX(-50%);width:calc(var(--w)*.042);height:calc(var(--w)*.042);background:#000;border-radius:50%;box-shadow:inset 0 0 0 1px #1c1c1c;z-index:2}
.and .sb{height:calc(var(--w)*.12);padding:0 calc(var(--w)*.06);font-size:calc(var(--w)*.042);font-weight:500}
.and .k{background:#3A3C40;width:calc(var(--w)*.01);right:calc(var(--w)*-.008)}

/* sections */
section{padding:96px 0 0}
.center{text-align:center}
.sub{color:var(--mute);margin-top:10px;font-size:17px}
.tiles{display:grid;gap:16px}
.tile{background:#fff;border-radius:32px;padding:40px 24px 0;text-align:center;overflow:hidden;height:520px;display:flex;flex-direction:column;align-items:center}
.tile:nth-child(2),.tile:nth-child(3){background:var(--tile)}
.tile h3{font-size:30px;font-weight:600;letter-spacing:-.02em}
[dir=rtl] .tile h3{letter-spacing:0}
.tile p{color:var(--mute);font-size:16px;margin-top:8px;max-width:300px}
.tile .crop{margin-top:32px;flex:1;width:100%;overflow:hidden;display:flex;justify-content:center;align-items:flex-start;-webkit-mask-image:linear-gradient(#000 80%,transparent);mask-image:linear-gradient(#000 80%,transparent)}
.tile .dev .frame{box-shadow:0 24px 50px -24px rgba(15,31,26,.35)}
.dark{background:var(--dark);color:#fff;border-radius:32px;padding:64px 24px;margin-top:96px;display:grid;gap:40px}
.dark h2{font-size:42px}
.dark .sub{color:#A3B1AC;max-width:440px;margin-top:16px}
.dark .more-link{display:inline-block;margin-top:24px;color:var(--mint);text-underline-offset:4px}
.plist{display:grid;gap:22px;list-style:none}
.plist li{color:#A3B1AC;font-size:15px;border-top:1px solid #26332F;padding-top:16px}
.plist b{display:block;font-size:17px;font-weight:600;color:#fff}
.more{display:grid;gap:12px;margin-top:40px;grid-template-columns:1fr 1fr;list-style:none}
.more li{font-size:15px;color:var(--mute);background:#fff;border-radius:22px;padding:20px 18px;min-width:0;overflow-wrap:break-word}
.more .ic{width:42px;height:42px;border-radius:13px;background:#E3F5EC;color:var(--deep);display:grid;place-items:center;margin-bottom:12px}
.more b{display:block;color:var(--ink);font-weight:600;font-size:16px;margin-bottom:4px}
.plans{display:grid;gap:16px;margin-top:40px}
.plan{background:#fff;border-radius:26px;padding:32px 24px;text-align:center;border:2px solid transparent}
.plan.best{border-color:var(--teal)}
.plan .tag{display:inline-block;background:#E3F5EC;color:var(--deep);font-size:12px;font-weight:600;border-radius:999px;padding:3px 12px;margin-bottom:8px}
.plan h3{font-size:19px;font-weight:600}
.plan .p{font-size:40px;font-weight:600;letter-spacing:-.02em;margin-top:10px}
.plan .p span{font-size:16px;font-weight:500;color:var(--mute);margin-inline-start:6px}
.plan p{color:var(--mute);font-size:14.5px}
.plan .pill{margin-top:20px}
.note{font-size:13px;color:var(--mute);margin-top:16px;text-align:center}
.faq{max-width:760px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line);padding:20px 0}
.faq summary{font-size:17px;font-weight:500;display:flex;justify-content:space-between;gap:16px;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--mute);font-weight:400;font-size:20px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--mute);font-size:15.5px;margin-top:8px}
.final{padding:96px 0 16px;text-align:center}
.final .icon{width:76px;height:76px;border-radius:20px;box-shadow:0 12px 30px rgba(10,92,75,.25)}
.final h2{margin-top:24px}
.stores{display:flex;gap:12px;justify-content:center;margin-top:24px;flex-wrap:wrap}
footer{margin-top:64px;border-top:1px solid var(--line);padding:24px 0 40px;font-size:13px;color:var(--mute)}
footer .row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
footer .links{display:flex;gap:20px;flex-wrap:wrap}
footer .links a{color:var(--ink);text-decoration:none}footer .links a:hover{color:var(--teal)}

/* legal and support pages */
.lg{background:#fff}
.lg footer{margin-top:0}
.ltitle{padding:48px 0 40px;text-align:center;background:var(--bg)}
.ltitle h1{font-size:42px}
.ltitle p{color:var(--mute);max-width:560px;margin:12px auto 0;font-size:17px}
.ltitle .upd{font-size:13px;margin-top:10px}
.lbody{display:grid;gap:40px;padding:40px 20px 64px}
.sumgrid{display:grid;gap:12px}
.sumc{background:var(--bg);border-radius:22px;padding:20px}
.sumc .n{width:28px;height:28px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:600}
.sumc b{display:block;font-size:16.5px;font-weight:600;margin-top:10px}
.sumc p{color:var(--mute);font-size:14.5px;margin-top:2px}
.lbl{font-size:13px;color:var(--mute);font-weight:500;margin-bottom:8px}
.toc{font-size:14.5px}
.toc summary{cursor:pointer;font-weight:500;padding:12px 16px;background:var(--bg);border-radius:14px}
.toc ol{list-style:none;margin-top:8px}
.tocd{display:none}
.toc a{display:block;padding:7px 0;text-decoration:none;border-bottom:1px solid #EEF3F0}
.toc a:hover{color:var(--teal)}
.doc{max-width:760px}
.sec{padding-top:40px;scroll-margin-top:16px}
.sec h2{font-size:26px}
.sec p,.sec li{color:#33403C;font-size:16.5px;line-height:1.75}
.sec p{margin-top:12px}
.sec ul{margin-top:12px;padding-inline-start:22px;display:grid;gap:10px}
.sec a{color:var(--teal)}
.mailbox{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;background:var(--bg);border-radius:22px;padding:20px 24px}
.mailbox b{font-size:18px;direction:ltr}
.nf{min-height:60vh;display:grid;place-content:center;text-align:center;gap:16px;padding:64px 20px}

@media (min-width:900px){
  .wrap{padding:0 48px}
  .mainnav{display:flex}
  .hero{grid-template-columns:1fr 1fr;padding:56px 0 24px;gap:64px}
  h1{font-size:72px}
  h2{font-size:52px}
  .lead{font-size:19px}
  .actions .badge.second{display:inline-flex}
  .actions .alt{display:none}
  [data-os=and] .actions .b-ios{order:2}
  .visual{padding:32px 0}
  .bubble{top:110px;inset-inline-end:24px}
  .txn{bottom:150px;inset-inline-start:24px}
  section{padding-top:128px}
  .tiles{grid-template-columns:1fr 1fr;gap:24px}
  .tile{height:620px;padding-top:56px}
  .tile h3{font-size:40px}
  .dark{grid-template-columns:1fr 1fr;padding:80px 72px;align-items:center;margin-top:128px}
  .dark h2{font-size:60px}
  .more{grid-template-columns:repeat(3,1fr);gap:16px}
  .more li{padding:28px 26px}
  .plans{grid-template-columns:repeat(3,1fr)}
  .final{padding-top:128px}
  .ltitle{padding:72px 0 56px}
  .ltitle h1{font-size:60px}
  .lbody{grid-template-columns:220px 1fr;gap:64px;padding:56px 48px 96px}
  .sumgrid{grid-template-columns:1fr 1fr}
  .sec h2{font-size:32px}
  .toc{position:sticky;top:24px;align-self:start}
  .tocm{display:none}
  .tocd{display:block}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (min-width:1200px){.visual .dev{--w:330px!important}}