/* Website critical CSS (render-blocking): tokens light/dark, fonts, base, header + country picker, hero, app window and the invoice mock-up. The rest: rest.css. */

@font-face{font-family:"Readex";font-style:normal;font-weight:400;font-display:swap;src:url(../type/readex-arabic-400.woff2?v=2c23706a72ee) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Readex";font-style:normal;font-weight:500;font-display:swap;src:url(../type/readex-arabic-500.woff2?v=5e3d5d429fd4) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Readex";font-style:normal;font-weight:600;font-display:swap;src:url(../type/readex-arabic-600.woff2?v=39fb881337d3) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Readex";font-style:normal;font-weight:400;font-display:swap;src:url(../type/readex-latin-400.woff2?v=e846a3aa9fd6) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Readex";font-style:normal;font-weight:500;font-display:swap;src:url(../type/readex-latin-500.woff2?v=c555ffb8c674) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Readex";font-style:normal;font-weight:600;font-display:swap;src:url(../type/readex-latin-600.woff2?v=d6318c6fc4b2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* metric-matched fallback for Latin (Readex Pro 400/600 vs Arial): the English text keeps its line breaks when the web font swaps in (no layout shift) */
@font-face{font-family:"Readex Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica Neue"),local("Helvetica");size-adjust:111%;ascent-override:90%;descent-override:22.5%;line-gap-override:0%;unicode-range:U+0000-00FF,U+2000-206F}

/* ------------------------------------------------------------------ tokens */
:root{
	--bg:#F6F7F4;--bg-2:#FFFFFF;--bg-3:#EEF1EC;--card:#FFFFFF;
	--ink:#0E1B2C;--ink-2:#283442;--ink-3:#4A5560;--ink-4:#5F6A75;
	--line:#E2E5E0;--line-2:#C9CEC7;
	--em:#0E7A5C;--em-deep:#094F3C;--em-light:#399279;--em-text:#0E7A5C;--mint:#E3F2EC;
	--gold:#E0A526;--gold-text:#8A6414;--gold-soft:#FBF4E2;--gold-line:#B3841E;
	--field-line:#8A948C;
	--seal:#1E4F8F;--seal-soft:#EAF0F8;--stamp:#C2410C;--stamp-soft:#FCECE4;--income:#158056;
	--glass:rgb(255 255 255/.66);--glass-line:rgb(255 255 255/.85);--glass-blur:16px;
	--hdr:rgb(246 247 244/.78);
	--sh-1:0 1px 2px rgb(14 27 44/.06);
	--sh-2:0 1px 2px rgb(14 27 44/.05),0 6px 16px -4px rgb(14 27 44/.09);
	--sh-3:0 2px 4px rgb(14 27 44/.04),0 14px 28px -8px rgb(14 27 44/.12),0 40px 80px -24px rgb(9 79 60/.26);
	--grad-pri:linear-gradient(180deg,#16876A 0%,#0E7A5C 55%,#0B6B51 100%);
	--grad-em:linear-gradient(135deg,#399279 0%,#0E7A5C 45%,#094F3C 100%);
	--grad-gold:linear-gradient(135deg,#EBC572 0%,#E0A526 55%,#B3841E 100%);
	--aur-a:rgb(14 122 92/.20);--aur-b:rgb(224 165 38/.16);--aur-g:rgb(57 146 121/.16);
	--grid:rgb(14 27 44/.055);
	--ease:cubic-bezier(.2,1,.2,1);--ease-io:cubic-bezier(.65,0,.35,1);
	--wrap:1200px;--gut:clamp(16px,4vw,32px);--r:14px;--hh:64px;
	/* the app screens in the mock-ups: the app's own light palette here, its dark palette in dark mode */
	--m-bg:#FFFFFF;--m-bg-2:#F6F7F4;--m-bg-3:#EEF1EC;--m-ink:#0E1B2C;--m-ink-3:#4A5560;--m-ink-4:#6B7580;--m-line:#E2E5E0;
	--m-em:#0E7A5C;--m-em-soft:#E3F2EC;--m-em-soft-2:#F2FAF6;--m-em-line:#B9E2CF;--m-inc:#158056;--m-inc-soft:#E3F4EC;
	--m-exp:#C2410C;--m-exp-soft:#E8B6A0;--m-seal:#1E4F8F;--m-seal-soft:#EAF0F8;--m-gold-soft:#FBF4E2;
	--m-bar-a:#FBFCFA;--m-bar-b:#F2F4F0;--m-spark:#A9B4C2;--m-bar-light:#9CD8BF;--m-frame:rgb(14 27 44/.10);
	color-scheme:light;
}
:root[data-theme="dark"]{
	/* the waiting page's night (public/launch/launch.css): ink #0E1B2C, raised #17283D, lines #24364D, fog #A9B4C2, mint, gold */
	--bg:#0E1B2C;--bg-2:rgb(14 27 44/.55);--bg-3:rgb(23 40 61/.7);--card:rgb(23 40 61/.78);
	--ink:#FFFFFF;--ink-2:#E6ECF2;--ink-3:#A9B4C2;--ink-4:#8E9AAA;
	--line:#24364D;--line-2:#2F4560;
	--em:#0E7A5C;--em-text:#7FD8B8;--mint:rgb(14 122 92/.18);
	--gold-text:#EBC572;--gold-soft:rgb(224 165 38/.12);
	--seal-soft:rgb(120 160 220/.13);--stamp:#FF8A5B;--stamp-soft:rgb(194 65 12/.16);--income:#4FD1A0;--field-line:#5A7290;
	--glass:linear-gradient(180deg,rgb(23 40 61/.88),rgb(14 27 44/.72));--glass-line:rgb(255 255 255/.08);
	--hdr:rgb(14 27 44/.72);
	--sh-1:0 1px 2px rgb(0 0 0/.3);
	--sh-2:0 1px 2px rgb(0 0 0/.3),0 10px 30px -12px rgb(0 0 0/.6);
	--sh-3:0 2px 6px rgb(0 0 0/.3),0 40px 80px -30px rgb(0 0 0/.8),0 0 80px -20px rgb(14 122 92/.45);
	--aur-a:rgb(14 122 92/.0);--aur-b:rgb(224 165 38/.0);--aur-g:rgb(57 146 121/.0);
	--grid:rgb(169 180 194/.06);
	/* the app's dark theme (frontend/src/styles/index.css): paper #0E1B2C / #17283D / #1F324A, line #24364D, folder #4DB694 */
	--m-bg:#0E1B2C;--m-bg-2:#17283D;--m-bg-3:#1F324A;--m-ink:#F1F4F7;--m-ink-3:#D2DAE3;--m-ink-4:#A9B4C2;--m-line:#24364D;
	--m-em:#4DB694;--m-em-soft:#103432;--m-em-soft-2:#12302E;--m-em-line:#1E5A4A;--m-inc:#5CC896;--m-inc-soft:#10322A;
	--m-exp:#FF8C64;--m-exp-soft:#7A3A26;--m-seal:#8FB4F0;--m-seal-soft:#162640;--m-gold-soft:#282418;
	--m-bar-a:#17283D;--m-bar-b:#132235;--m-spark:#62768E;--m-bar-light:#2E6E58;--m-frame:rgb(255 255 255/.08);
	color-scheme:dark;
}
:root[data-theme="dark"] body{background:radial-gradient(1200px 800px at 80% -10%,rgb(14 122 92/.28),transparent 60%),radial-gradient(900px 700px at -10% 30%,rgb(224 165 38/.04),transparent 60%),#0E1B2C}
/* the night layer (dark only): aurora, grid, stars, grain — fixed behind everything, like the waiting page */
.night{display:none}
:root[data-theme="dark"] .night{display:block;position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.night span{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;mix-blend-mode:screen;animation:drift 18s ease-in-out infinite alternate}
.night__a{width:42vw;height:42vw;left:-8vw;top:10vh;background:#0E7A5C}
.night__b{width:30vw;height:30vw;right:-6vw;top:50vh;background:#094F3C;animation-duration:22s}
.night span.night__c{opacity:.35;animation-duration:26s}
@keyframes drift{to{transform:translate3d(6vw,-4vh,0) scale(1.15)}}
.night i{position:absolute;inset:0}
.night__grid{background-image:linear-gradient(rgb(169 180 194/.06) 1px,transparent 1px),linear-gradient(90deg,rgb(169 180 194/.06) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 50% 0%,#000 20%,transparent 70%)}
.night__stars{opacity:.7;background-image:radial-gradient(1.2px 1.2px at 12% 18%,#fff 50%,transparent),radial-gradient(1px 1px at 78% 12%,#BFF3DD 50%,transparent),radial-gradient(1.4px 1.4px at 88% 64%,#fff 50%,transparent),radial-gradient(1px 1px at 32% 82%,#EBC572 50%,transparent),radial-gradient(1px 1px at 55% 36%,#fff 50%,transparent),radial-gradient(1.2px 1.2px at 6% 58%,#BFF3DD 50%,transparent),radial-gradient(1px 1px at 66% 90%,#fff 50%,transparent),radial-gradient(1px 1px at 44% 8%,#EBC572 50%,transparent)}
.night__grain{inset:-50%!important;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%,to{transform:translate(0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
@media (max-width:720px){.night span{filter:blur(50px)}}
:root[data-theme="dark"] .aur,:root[data-theme="dark"] .ledger{display:none}

/* ------------------------------------------------------------------ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:var(--stick)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Readex","Readex Fallback",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
[dir="ltr"] body{line-height:1.6}
img,svg,video{display:block;max-width:100%}
img,video{height:auto}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
bdi,.num{font-variant-numeric:tabular-nums}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--em-light);outline-offset:3px;border-radius:6px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:10px}
.skip:focus{top:12px}
.i{width:20px;height:20px;flex:none}
.bi{width:22px;height:22px;flex:none}
.bi .ac{stroke:var(--gold)}
[dir="rtl"] .i-dir{transform:scaleX(-1)}
.wrap{width:min(var(--wrap),100% - 2*var(--gut));margin-inline:auto}

/* type */
.h1{font-size:clamp(2.1rem,1.25rem + 3.3vw,4.1rem);line-height:1.22;font-weight:600;letter-spacing:0;text-wrap:balance}
.h2{font-size:clamp(1.65rem,1.1rem + 2vw,2.75rem);line-height:1.3;font-weight:600;text-wrap:balance}
.h3{font-size:clamp(1.08rem,1rem + .3vw,1.3rem);line-height:1.45;font-weight:600}
[dir="ltr"] .h1{line-height:1.08;letter-spacing:-.022em}
[dir="ltr"] .h2{line-height:1.14;letter-spacing:-.015em}
[dir="ltr"] .h3{line-height:1.3}
.lead{font-size:clamp(1.02rem,.95rem + .35vw,1.22rem);line-height:1.8;color:var(--ink-3);text-wrap:pretty;max-width:46ch}
[dir="ltr"] .lead{line-height:1.6}
.hl{background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;padding-inline:.04em}
:root[data-theme="light"] .hl{background:linear-gradient(135deg,#A97A12 0%,#8A6414 100%);-webkit-background-clip:text;background-clip:text}
@media (forced-colors:active){.hl{background:none!important;color:CanvasText!important}}
.kick{display:inline-flex;align-items:center;gap:8px;font-size:.84rem;font-weight:500;line-height:1.4;color:var(--em-text);background:var(--mint);border:1px solid rgb(14 122 92/.14);padding:6px 12px;border-radius:999px;margin-bottom:18px}
[dir="ltr"] .kick{letter-spacing:.02em}
.kick .flag{width:18px;height:18px}
.micro{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:20px;font-size:.86rem;color:var(--ink-3)}
.micro span{display:inline-flex;align-items:center;gap:6px}
.micro .i{width:16px;height:16px;color:var(--em-text)}

/* buttons */
.btn{--h:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:0 20px;border-radius:12px;font-weight:500;font-size:.98rem;line-height:1.2;white-space:nowrap;border:1px solid transparent;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background-color .2s,border-color .2s}
.btn .i{width:18px;height:18px}
.btn--lg{--h:52px;padding:0 24px;font-size:1.02rem;border-radius:14px}
.btn--sm{--h:38px;padding:0 16px;font-size:.92rem;border-radius:10px}
.btn--block{display:flex;width:100%}
.btn--pri{background:var(--grad-pri);color:#fff;box-shadow:0 1px 0 rgb(255 255 255/.18) inset,0 8px 18px -8px rgb(9 79 60/.55)}
.btn--pri:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgb(255 255 255/.18) inset,0 14px 26px -10px rgb(9 79 60/.6)}
.btn--ghost{background:var(--card);color:var(--ink);border-color:var(--line-2);box-shadow:var(--sh-1)}
.btn--ghost:hover{border-color:var(--em-light);transform:translateY(-1px)}
.btn--gold{background:var(--grad-gold);color:#2B1D02;box-shadow:0 10px 24px -10px rgb(224 165 38/.7)}
.btn--gold:hover{transform:translateY(-1px)}
.btn--glass{background:rgb(255 255 255/.12);color:#fff;border-color:rgb(255 255 255/.32);backdrop-filter:blur(10px)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* ------------------------------------------------------------------ header: floating glass bar that hides on scroll down */
:root{--stick:calc(var(--hh) + 28px)}
:root.hdr-hidden{--stick:16px}
.hdr{position:sticky;top:0;z-index:50;height:calc(var(--hh) + 12px);margin-bottom:calc(-12px - var(--hh));padding:10px var(--gut) 0;pointer-events:none;transition:transform .25s var(--ease)}
.hdr.is-hidden{transform:translateY(calc(-100% - 8px))}
main>section:first-child,main>div:first-child>section:first-child{padding-top:calc(var(--hh) + 12px + clamp(20px,4vh,56px))}
.hdr__bar{pointer-events:auto;position:relative;max-width:calc(var(--wrap) + 40px);margin-inline:auto;height:var(--hh);display:flex;align-items:center;gap:14px;padding-inline:16px 10px;border-radius:20px;background:linear-gradient(180deg,rgb(255 255 255/.78),rgb(255 255 255/.6));box-shadow:0 1px 0 rgb(255 255 255/.95) inset,0 0 0 1px rgb(14 27 44/.06),0 2px 6px -2px rgb(14 27 44/.08),0 14px 34px -16px rgb(14 27 44/.28);backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);transition:height .3s var(--ease),background .3s,box-shadow .3s}
.hdr__bar::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(120deg,rgb(255 255 255/.9),rgb(57 146 121/.25) 40%,rgb(224 165 38/.25) 70%,rgb(255 255 255/.7));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
[dir="rtl"] .hdr__bar{padding-inline:16px 10px}
.hdr.is-stuck .hdr__bar{height:calc(var(--hh) - 6px);background:linear-gradient(180deg,rgb(255 255 255/.92),rgb(255 255 255/.82))}
:root[data-theme="dark"] .hdr__bar{background:linear-gradient(180deg,rgb(23 40 61/.78),rgb(14 27 44/.62));box-shadow:0 1px 0 rgb(255 255 255/.07) inset,0 0 0 1px rgb(255 255 255/.04),0 18px 44px -18px rgb(0 0 0/.75)}
:root[data-theme="dark"] .hdr__bar::before{background:linear-gradient(120deg,rgb(255 255 255/.14),rgb(57 146 121/.35) 40%,rgb(224 165 38/.25) 70%,rgb(255 255 255/.08))}
:root[data-theme="dark"] .hdr.is-stuck .hdr__bar{background:linear-gradient(180deg,rgb(23 40 61/.94),rgb(14 27 44/.9))}
.logo{display:inline-flex;align-items:center;flex:none;min-height:44px;perspective:400px}
.logo__img{height:32px;width:auto;transition:transform .5s var(--ease)}
.logo:hover .logo__img{transform:rotateY(-14deg) rotateX(6deg) scale(1.03)}
[dir="rtl"] .logo:hover .logo__img{transform:rotateY(14deg) rotateX(6deg) scale(1.03)}
.logo__img--dark{display:none}
:root[data-theme="dark"] .logo__img--light{display:none}
:root[data-theme="dark"] .logo__img--dark{display:block}
.nav{position:relative;display:flex;align-items:center;gap:2px;margin-inline-start:8px}
.nav__a{position:relative;z-index:1;display:inline-flex;align-items:center;height:40px;padding:0 14px;border-radius:12px;font-size:.95rem;color:var(--ink-3);font-weight:500;transition:color .2s}
.nav__a:hover,.nav__a[aria-current]{color:var(--ink)}
.nav__a[aria-current]{color:var(--em-text)}
.nav__a[aria-current]::after{content:"";position:absolute;inset-inline:14px;bottom:5px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--em-light),var(--gold))}
.nav__ind{position:absolute;z-index:0;top:50%;height:40px;margin-top:-20px;inset-inline-start:0;width:var(--w,0);transform:translateX(var(--x,0));border-radius:12px;background:rgb(14 27 44/.05);box-shadow:0 0 0 1px rgb(14 27 44/.05) inset;opacity:var(--o,0);transition:transform .35s var(--ease),width .35s var(--ease),opacity .2s}
:root[data-theme="dark"] .nav__ind{background:rgb(255 255 255/.06);box-shadow:0 0 0 1px rgb(255 255 255/.06) inset}
[dir="rtl"] .nav__ind{inset-inline-start:auto;left:0}
.nav__mega{position:relative;display:inline-flex;align-items:center}
.nav__a--mega{padding-inline-end:4px}
.nav__more{display:inline-grid;place-items:center;width:36px;height:40px;margin-inline-start:-6px;border-radius:10px;color:var(--ink-3);position:relative;z-index:1}
.nav__more:hover,.nav__more[aria-expanded="true"]{color:var(--ink)}
.mega{position:absolute;top:calc(100% + 16px);inset-inline-start:-40px;width:min(660px,calc(100vw - 48px));opacity:0;visibility:hidden;transform:translateY(-6px) scale(.98);transform-origin:top;transition:opacity .2s,transform .3s var(--ease),visibility .2s}
.nav__mega.is-open .mega{opacity:1;visibility:visible;transform:none}
.mega__in{padding:14px;border-radius:22px;background:rgb(255 255 255/.9);box-shadow:0 0 0 1px rgb(14 27 44/.06),0 30px 60px -24px rgb(14 27 44/.35);backdrop-filter:blur(22px) saturate(1.6);-webkit-backdrop-filter:blur(22px) saturate(1.6)}
:root[data-theme="dark"] .mega__in{background:rgb(23 40 61/.95);box-shadow:0 0 0 1px rgb(255 255 255/.06),0 30px 60px -24px rgb(0 0 0/.8)}
.mega__title{font-size:.8125rem;font-weight:600;color:var(--ink-4);margin:2px 8px 8px}
.mega__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.mega__app{display:flex;gap:12px;align-items:flex-start;padding:10px;border-radius:14px;transition:background-color .2s,transform .25s var(--ease)}
.mega__app:hover,.mega__app:focus-visible{background:var(--bg-3);transform:translateY(-1px)}
.mega__app b{display:block;font-weight:600;font-size:.93rem;line-height:1.35}
.mega__app small{display:block;color:var(--ink-4);font-size:.8125rem;line-height:1.45}
.mega__ico{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--mint);color:var(--em-text);box-shadow:0 1px 0 rgb(255 255 255/.7) inset,0 6px 14px -8px rgb(14 27 44/.35)}
.mega__ico.app--gold{background:var(--gold-soft);color:var(--gold-text)}
.mega__ico.app--seal{background:var(--seal-soft);color:var(--seal)}
:root[data-theme="dark"] .mega__ico.app--seal{color:#9DB9E6}
.mega__ico .bi{width:22px;height:22px}
.mega__all{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:8px;height:44px;border-radius:12px;background:var(--bg-3);color:var(--em-text);font-weight:600;font-size:.9rem}
.mega__all .i{width:16px;height:16px}
.tools{display:flex;align-items:center;gap:8px;margin-inline-start:auto}
.tool{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:42px;min-width:42px;padding:0 10px;border-radius:12px;color:var(--ink-2);background:rgb(255 255 255/.6);box-shadow:0 0 0 1px rgb(14 27 44/.08) inset;font-size:.88rem;font-weight:500;cursor:pointer}
:root[data-theme="dark"] .tool{background:rgb(255 255 255/.05);box-shadow:0 0 0 1px rgb(255 255 255/.1) inset;color:#fff}
.btn--glassy{background:rgb(255 255 255/.55);color:var(--ink);box-shadow:0 1px 0 #fff inset,0 0 0 1px rgb(14 27 44/.1) inset;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn--glassy:hover{box-shadow:0 1px 0 #fff inset,0 0 0 1px rgb(57 146 121/.6) inset;transform:translateY(-1px)}
:root[data-theme="dark"] .btn--glassy{background:rgb(255 255 255/.06);color:#fff;box-shadow:0 1px 0 rgb(255 255 255/.08) inset,0 0 0 1px rgb(255 255 255/.12) inset}
.btn--cta{background:linear-gradient(135deg,#1FA67D 0%,#0E7A5C 50%,#0A6249 100%);color:#fff;box-shadow:0 1px 0 rgb(255 255 255/.25) inset,0 10px 24px -10px rgb(14 122 92/.75),0 0 0 1px rgb(9 79 60/.5);transition:transform .2s var(--ease),box-shadow .25s}
.btn--cta .i{transition:transform .25s var(--ease)}
.btn--cta:hover{box-shadow:0 1px 0 rgb(255 255 255/.25) inset,0 14px 30px -10px rgb(14 122 92/.9),0 0 22px -4px rgb(224 165 38/.45),0 0 0 1px rgb(9 79 60/.5);transform:translateY(-1px)}
.btn--cta:hover .i-dir{transform:translateX(3px)}
[dir="rtl"] .btn--cta:hover .i-dir{transform:scaleX(-1) translateX(3px)}
.btn--cta:active,.btn--glassy:active,.btn--pri:active{transform:scale(.97)}
.btn--sm{--h:42px}
.signin{white-space:nowrap}
.prefs__btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding-inline:10px 8px;border-radius:999px;background:rgb(255 255 255/.6);box-shadow:0 1px 0 #fff inset,0 0 0 1px rgb(14 27 44/.08) inset,0 4px 12px -8px rgb(14 27 44/.25);font-size:.88rem;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:box-shadow .2s}
.prefs__btn:hover,.prefs__btn[aria-expanded="true"]{box-shadow:0 1px 0 #fff inset,0 0 0 1px rgb(57 146 121/.6) inset,0 6px 16px -8px rgb(14 122 92/.45)}
:root[data-theme="dark"] .prefs__btn{background:rgb(255 255 255/.06);box-shadow:0 1px 0 rgb(255 255 255/.08) inset,0 0 0 1px rgb(255 255 255/.12) inset;color:#fff}
.prefs__sep{opacity:.45}
.prefs__thm{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--bg-3);color:var(--gold-text)}
.prefs__thm .i{width:15px;height:15px}
.prefs__thm .i-moon{display:none}
:root[data-theme="dark"] .prefs__thm .i-sun{display:none}
:root[data-theme="dark"] .prefs__thm .i-moon{display:block}
.prefs__chev{width:14px;height:14px;opacity:.55;transition:transform .25s}
.prefs__btn[aria-expanded="true"] .prefs__chev{transform:rotate(180deg)}
.flag{width:20px;height:20px;flex:none;border-radius:4px;filter:drop-shadow(0 2px 3px rgb(14 27 44/.22))}
.flag--btn{width:24px;height:24px}
.mnav__btn{display:none}
/* sheets (phone menu, preferences): :target works without JS; site.js adds .is-open, focus trap, Esc */
[data-sheet]{display:none}
[data-sheet]:target,[data-sheet].is-open{display:block}
.mnav{position:fixed;inset:0;z-index:70;padding:calc(14px + env(safe-area-inset-top)) var(--gut) calc(20px + env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;background:rgb(246 247 244/.9);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5)}
:root[data-theme="dark"] .mnav{background:rgb(14 27 44/.92)}
.mnav:target,.mnav.is-open{display:flex;flex-direction:column;animation:fadein .25s var(--ease)}
@keyframes fadein{from{opacity:0}}
.mnav__top{display:flex;align-items:center;justify-content:space-between;height:52px;margin-bottom:10px}
.mnav__nav{display:grid}
.mnav__nav a{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:0 6px;border-bottom:1px solid var(--line);font-weight:600;font-size:1.3rem}
.mnav__nav a .i{width:20px;height:20px;opacity:.4}
.mnav__nav a[aria-current]{color:var(--em-text)}
.prefs__btn--wide{margin-top:18px;height:56px;justify-content:center;font-size:1rem;border-radius:16px}
.mnav__foot{display:grid;gap:10px;margin-top:auto;padding-top:20px}
/* preferences: a glass popover anchored under the pill (desktop), a bottom sheet with a grip (phones) */
.prefs{position:fixed;inset:0;z-index:80}
.prefs__scrim{position:absolute;inset:0;background:rgb(14 27 44/.18)}
:root[data-theme="dark"] .prefs__scrim{background:rgb(0 0 0/.35)}
.prefs__panel{position:absolute;top:var(--pt,calc(var(--hh) + 18px));inset-inline-end:var(--pe,var(--gut));width:min(380px,calc(100vw - 2*var(--gut)));max-height:calc(100svh - var(--hh) - 40px);overflow:auto;overscroll-behavior:contain;padding:18px;border-radius:24px;background:linear-gradient(180deg,rgb(255 255 255/.94),rgb(255 255 255/.86));box-shadow:0 0 0 1px rgb(14 27 44/.06),0 1px 0 #fff inset,0 40px 80px -30px rgb(14 27 44/.45);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);transform-origin:top right;animation:popin .28s var(--ease)}
[dir="rtl"] .prefs__panel{transform-origin:top left}
:root[data-theme="dark"] .prefs__panel{background:linear-gradient(180deg,rgb(23 40 61/.97),rgb(14 27 44/.94));box-shadow:0 0 0 1px rgb(255 255 255/.08),0 1px 0 rgb(255 255 255/.06) inset,0 40px 80px -30px rgb(0 0 0/.85)}
@keyframes popin{from{opacity:0;transform:translateY(-6px) scale(.96)}}
.prefs__grip{display:none}
.prefs__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.prefs__title{font-weight:600;font-size:1.05rem}
.prefs__x{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--bg-3);color:var(--ink-3)}
.prefs__x .i{width:18px;height:18px}
.prefs__sec{padding-block:12px;border-top:1px solid var(--line)}
.prefs__sec:first-of-type{border-top:0}
.prefs__h{font-size:.8125rem;font-weight:600;color:var(--ink-4);margin-bottom:10px}
.prefs__note{font-size:.8125rem;color:var(--ink-4);padding-top:10px;border-top:1px solid var(--line)}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;background:var(--bg-3);box-shadow:0 0 0 1px var(--line) inset}
.seg--3{grid-template-columns:repeat(3,1fr)}
.seg a,.seg button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:6px;border-radius:10px;font-weight:500;font-size:.92rem;color:var(--ink-3);text-align:center;transition:background-color .2s,color .2s,box-shadow .2s}
.seg .i{width:17px;height:17px}
.seg [aria-current],.seg [aria-checked="true"]{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgb(14 27 44/.12),0 0 0 1px rgb(14 27 44/.04)}
:root[data-theme="dark"] .seg [aria-current],:root[data-theme="dark"] .seg [aria-checked="true"]{background:rgb(255 255 255/.1);color:#fff;box-shadow:0 0 0 1px rgb(255 255 255/.1)}
.cp__search{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;border-radius:12px;background:var(--bg-3);box-shadow:0 0 0 1px var(--field-line) inset;color:var(--ink-4)}
.cp__search:focus-within{box-shadow:0 0 0 2px var(--em-light) inset}
.cp__search .i{width:18px;height:18px}
.cp__search input{flex:1;min-width:0;border:0;background:none;outline:none;color:var(--ink);font-size:1rem}
/* list height = whole rows only (6 × 46px): a row is never cut */
.cp__list{margin-top:8px;height:276px;overflow:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;scrollbar-width:thin}
.cp__list li{scroll-snap-align:start}
.cp__list a{display:flex;align-items:center;gap:12px;height:46px;padding:0 10px;border-radius:12px;font-size:.95rem}
.cp__list a:hover,.cp__list a:focus-visible{background:var(--bg-3)}
.cp__list a[aria-current]{font-weight:600;color:var(--em-text)}
.cp__list .flag{width:26px;height:26px}
.cp__n{flex:1}
.cp__cur{font-size:.8125rem;color:var(--ink-4);font-weight:500}
.cp__tick{display:grid;place-items:center;width:22px;height:22px;flex:none}
.cp__tick .i{width:18px;height:18px;color:var(--em-text)}
.cp__empty{padding:14px 10px;color:var(--ink-4);font-size:.9rem}
@media (max-width:1100px){.nav,.signin{display:none}.mnav__btn{display:inline-flex}.tools>.prefs__btn{display:none}}
@media (max-width:720px){
	.hdr{padding:8px 10px 0}
	.hdr__bar{gap:8px;padding-inline:12px 8px}
	[dir="rtl"] .hdr__bar{padding-inline:12px 8px}
	.hdr__cta,.hdr .prefs__name,.hdr .prefs__sep,.hdr .prefs__thm,.hdr .prefs__chev{display:none}
	.logo__img{height:28px}
	.tool,.prefs__btn{height:44px;min-width:44px}
	.prefs__scrim{background:rgb(14 27 44/.35)}
	.prefs__panel{inset:auto 0 0 0;top:auto;width:auto;max-height:92svh;border-radius:26px 26px 0 0;padding:8px 18px calc(18px + env(safe-area-inset-bottom));transform-origin:bottom;animation:sheetup .32s var(--ease)}
	.prefs__grip{display:block;width:44px;height:5px;border-radius:5px;background:var(--line-2);margin:4px auto 10px}
	.cp__list{height:230px}
}
@keyframes sheetup{from{transform:translateY(60px);opacity:0}}
@media (max-height:640px) and (min-width:721px){.cp__list{height:184px}}

/* ------------------------------------------------------------------ aurora + ledger grid */
.aur{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.aur span{position:absolute;border-radius:50%;filter:blur(60px);will-change:transform}
.aur__a{width:52vw;height:52vw;max-width:760px;max-height:760px;background:var(--aur-a);top:-22%;inset-inline-end:-10%;transform:translate3d(0,calc(var(--hp,0)*-60px),0)}
.aur__b{width:36vw;height:36vw;max-width:520px;max-height:520px;background:var(--aur-b);top:30%;inset-inline-start:-12%;transform:translate3d(0,calc(var(--hp,0)*-110px),0)}
.aur__g{width:30vw;height:30vw;max-width:420px;max-height:420px;background:var(--aur-g);bottom:-20%;inset-inline-end:30%;transform:translate3d(0,calc(var(--hp,0)*-30px),0)}
.ledger{position:absolute;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%)}

/* ------------------------------------------------------------------ hero */
.hero{position:relative;isolation:isolate;min-height:min(100svh,980px);display:flex;align-items:center;padding-block:clamp(28px,5vh,64px)}
.hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);align-items:center}
.hero__h{margin-bottom:18px}
.hero__lead{max-width:42ch}
.hero__stage{position:relative;padding-bottom:clamp(120px,15vh,150px)}
.stage{position:relative;perspective:1800px;transform-style:preserve-3d;transform:rotateX(var(--py,0deg)) rotateY(var(--px,0deg));transition:transform .5s var(--ease)}
.dev{--rx:8deg;--ry:-13deg;--rz:.6deg;position:relative;transform-origin:50% 40%;transform:rotateX(calc(var(--rx)*(1 - var(--hp,0)))) rotateY(calc(var(--ry)*(1 - var(--hp,0)))) rotateZ(calc(var(--rz)*(1 - var(--hp,0)))) scale(calc(.96 + .04*var(--hp,0)));transform-style:preserve-3d}
[dir="rtl"] .dev{--ry:13deg;--rz:-.6deg}
.dev--flat{--rx:0deg;--ry:0deg;--rz:0deg}

/* app window */
.win{--mf:clamp(10px,min(1.02vw,1.92vh),15.5px);font-size:var(--mf);line-height:1.5;background:var(--m-bg);color:var(--m-ink);border-radius:1.15em;border:1px solid var(--m-frame);box-shadow:var(--sh-3);overflow:hidden;position:relative}
.win__bar{height:2.5em;display:flex;align-items:center;gap:.8em;padding:0 1em;background:linear-gradient(var(--m-bar-a),var(--m-bar-b));border-bottom:1px solid var(--m-line)}
.win__dots{display:flex;gap:.42em;direction:ltr}
.win__dots i{width:.72em;height:.72em;border-radius:50%;background:var(--m-line)}
.win__dots i:first-child{background:#F0A6A0}.win__dots i:nth-child(2){background:#F2D08B}.win__dots i:nth-child(3){background:#9CD8BF}
.win__url{display:inline-flex;align-items:center;gap:.4em;margin-inline:auto;font-size:.78em;color:var(--m-ink-4);background:var(--m-bg);border:1px solid var(--m-line);border-radius:.6em;padding:.15em .9em;direction:ltr}
.win__url .i{width:1em;height:1em}
.win__sp{width:3.4em}
.win__body{display:flex;min-height:0}
.win__rail{flex:none;width:3.3em;background:var(--m-bg-2);border-inline-end:1px solid var(--m-line);display:flex;flex-direction:column;align-items:center;gap:.5em;padding:.8em 0}
.win__mark img{width:1.9em;height:1.9em;border-radius:.5em}
.win__ri{width:2.3em;height:2.3em;border-radius:.6em;display:grid;place-items:center;color:var(--m-ink-4)}
.win__ri .bi{width:1.25em;height:1.25em}
.win__ri .bi .ac{stroke:currentColor}
.win__ri.is-on{background:var(--m-em-soft);color:var(--m-em)}
.win__main{flex:1;min-width:0;background:var(--m-bg)}
.appbar{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:.7em 1.3em;border-bottom:1px solid var(--m-line);font-size:.86em}
.appbar__crumb{color:var(--m-ink-3)}
.appbar__crumb i{font-style:normal;opacity:.5;margin-inline:.3em}
.appbar__btn{background:#0E7A5C;color:#fff;border-radius:.55em;padding:.32em 1em;font-weight:500}

/* ------------------------------------------------------------------ mock-ups: shared sequencing contract
   The finished screen is ALWAYS on show (first paint, no JS, reduced motion, mid-animation): demo.js only plays a delta
   on top — each [data-s] step lights up in turn (.on → a soft highlight sweep), amounts roll their digits in, the stamp
   lands and the hero's ledger card slides out at the end. Nothing is ever hidden or shows a wrong number. */
.armed [data-s].on{animation:litup 1.1s var(--ease) both}
@keyframes litup{0%{background-color:var(--m-em-soft);box-shadow:0 0 0 2px var(--m-em-line) inset}100%{box-shadow:0 0 0 0 transparent inset}}
.armed .float[data-s]:not(.on),.armed .jr[data-s]:not(.on){opacity:0;transform:translateY(12px) scale(.98)}
.dg{display:inline-block;overflow:hidden;vertical-align:bottom;line-height:1.15}
.dg>span{display:inline-block;animation:dgin .6s var(--ease) both;animation-delay:calc(var(--k,0)*45ms)}
@keyframes dgin{from{transform:translateY(105%);opacity:0}}
.mock{position:relative;margin:0}
.mock [data-s]{transition:opacity .45s var(--ease),transform .6s var(--ease),clip-path .6s var(--ease)}
.type{display:inline-block;transition:clip-path .7s steps(14)}

/* invoice */
.inv{position:relative;padding:1.3em 1.5em 1.4em;font-size:1em}
.inv__top{display:flex;justify-content:space-between;align-items:flex-start;gap:1em;padding-bottom:.9em;border-bottom:1px dashed var(--m-line)}
.inv__co{font-weight:600;font-size:1.02em}
.inv__kind{font-size:.82em;color:var(--m-em);font-weight:500}
.inv__meta{display:grid;justify-items:end;font-size:.78em;color:var(--m-ink-4);text-align:end}
.inv__meta bdi:first-child{font-weight:600;color:var(--m-ink)}
.inv__party{display:flex;gap:.6em;align-items:baseline;padding:.75em 0;font-size:.9em}
.inv__party span{color:var(--m-ink-4)}
.inv__lines{border:1px solid var(--m-line);border-radius:.75em;overflow:hidden}
.inv__row{display:grid;grid-template-columns:minmax(0,1fr) 3em 5.6em 6.4em;gap:.6em;align-items:center;padding:.58em .9em;font-size:.86em;border-top:1px solid var(--m-line);background:var(--m-bg)}
.inv__row bdi{text-align:end}
.inv__row--h{border-top:0;background:var(--m-bg-2);color:var(--m-ink-4);font-size:.76em;font-weight:500}
.inv__row--h span:not(:first-child){text-align:end}
.inv__row span.type{max-width:100%;line-height:1.35}
.inv__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:1em;margin-top:.9em}
.inv__code{display:flex;align-items:center;gap:.6em;font-size:.74em;color:var(--m-ink-4);max-width:12em}
.qr{width:4.6em;height:4.6em;flex:none;background:var(--m-bg);border:1px solid var(--m-line);border-radius:.4em;padding:.2em;fill:var(--m-ink)}
.qr__g{transition:clip-path 1.1s steps(21)}
.tstamp{display:grid;place-items:center;width:5.2em;height:5.2em;border-radius:50%;border:2px dashed var(--m-em);color:var(--m-em);text-align:center;line-height:1.1;transform:rotate(-8deg)}
.tstamp b{font-size:1.6em;font-weight:600}
.tstamp small{font-size:.6em}
.tstamp i{font-style:normal;font-size:.62em;max-width:7.4em;line-height:1.15}
.inv__tot{min-width:15em;display:grid;gap:.25em}
.inv__tot>div{display:flex;justify-content:space-between;gap:1em;font-size:.86em}
.inv__tot dt{color:var(--m-ink-3)}
.inv__grand{margin-top:.25em;padding-top:.45em;border-top:1px solid var(--m-line);font-size:1.02em!important;font-weight:600}
.inv__grand dt{color:var(--m-ink)!important}
.inv__grand .num{color:var(--m-em)}
.amt{white-space:nowrap}
.cur{font-size:.84em;color:inherit;opacity:.78}
.stamp{position:absolute;bottom:2.2em;inset-inline-start:36%;padding:.25em .9em;border:2.5px solid #1F9D6B;color:var(--m-inc);border-radius:.45em;font-weight:600;font-size:1.25em;transform:rotate(-12deg);background:rgb(227 242 236/.55);box-shadow:0 0 0 3px rgb(31 157 107/.12);pointer-events:none}
.armed .stamp:not(.on){opacity:0;transform:rotate(-12deg) scale(1.7)}
.stamp.on{transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}

/* the hero's floating glass cards */
.glassy{background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(var(--glass-blur)) saturate(1.5);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.5);box-shadow:0 1px 0 rgb(255 255 255/.6) inset,0 18px 40px -16px rgb(14 27 44/.28)}
.float{position:absolute;z-index:3;border-radius:16px;transform:translateZ(60px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.float--jr{inset-inline-start:2%;top:calc(100% + 22px);width:min(300px,52%);padding:12px 14px}
.float--chip{inset-inline-end:2%;top:calc(100% + 22px);display:flex;align-items:center;gap:8px;padding:9px 14px;font-size:.84rem;font-weight:500;color:var(--ink);border-radius:999px;transform:translateZ(90px)}
.float--chip .bi{width:20px;height:20px;color:var(--em-text)}
.jr{font-size:.82rem;color:var(--ink)}
.jr__h{display:flex;align-items:center;gap:6px;font-weight:600;font-size:.84rem;color:var(--em-text);margin-bottom:6px}
.jr__h .i{width:16px;height:16px;background:var(--em);color:#fff;border-radius:50%;padding:2px}
.jr__r{display:flex;justify-content:space-between;gap:12px;padding:3px 0;border-top:1px dashed rgb(14 27 44/.12);color:var(--ink-3)}
:root[data-theme="dark"] .jr__r{border-top-color:rgb(255 255 255/.1)}
.jr__r bdi{font-weight:500;color:var(--ink)}
.jr__r .dr::before{content:"+";color:var(--em-text);margin-inline-end:2px}
.hero .jr{opacity:1}
.hero__glass{position:absolute;width:clamp(68px,6.6vw,100px);inset-inline-start:-4%;top:-13%;z-index:4;translate:0 0 90px}

/* glass 3D logo */
.glass3d{position:relative;aspect-ratio:1;transform-style:preserve-3d;transform:rotateX(var(--grx,8deg)) rotateY(var(--gry,-14deg));transition:transform .6s var(--ease)}
[dir="rtl"] .glass3d{--gry:14deg}
.glass3d__l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.glass3d__edge{transform:translateZ(-10px) translateY(4px);filter:brightness(.8)}
.glass3d__e{transform:translateZ(16px)}
.glass3d__check{transform:translateZ(30px)}
.glass3d__shadow{position:absolute;inset-inline:14%;bottom:-16%;height:16%;border-radius:50%;background:rgb(0 0 0/.35);filter:blur(14px);transform:translateZ(-30px)}
.glass3d__tick{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1s var(--ease-io) .2s}
.js .glass3d:not(.is-in) .glass3d__tick{stroke-dashoffset:1}
.hero__glass .glass3d__shadow{background:rgb(9 79 60/.35)}

.hero__glass .glass3d__shadow{display:none}
.hero__glass .glass3d__body{filter:drop-shadow(0 14px 18px rgb(9 79 60/.35))}
.glass3d.hero__glass{position:absolute}
.coin{position:absolute;z-index:4;width:44px;height:44px;pointer-events:none;filter:drop-shadow(0 10px 14px rgb(0 0 0/.25));animation:bob 6s ease-in-out 3}
.coin--2{animation-duration:7.5s;animation-delay:-2s}
@keyframes bob{50%{transform:translateY(-10px) rotate(-8deg)}}
.coin--h1{inset-inline-end:-5%;top:38%;width:40px;height:40px}
.coin--h2{inset-inline-start:30%;top:-9%;width:30px;height:30px}
@media (max-width:1023px){.coin--h1,.coin--h2{display:none}}

@media (max-width:1023px){
	.hero{min-height:auto;padding-top:22px;padding-bottom:44px}
	.hero__grid{grid-template-columns:1fr;gap:26px}
	.hero__copy{text-align:start}
	.win{--mf:clamp(9.6px,2.84vw,13px)}
	[dir] .dev{--rx:0deg;--ry:0deg;--rz:0deg}
	.float--jr,.hero__glass{display:none}
	.float--chip{bottom:auto;top:-14px;inset-inline-end:10px;font-size:.78rem;padding:6px 11px}
	.hero__stage{padding-bottom:0}
	.ctas{margin-top:22px}
	.micro{margin-top:16px}
}
@media (max-width:720px){
	.win__rail{display:none}
	.hero__lead{font-size:1rem;line-height:1.75}
	.ctas .btn--lg{--h:50px;padding:0 18px}
	.ctas{gap:10px}
	.ctas .btn{flex:1 1 auto}
}
@media (max-width:480px){
	.hero{padding-top:16px}
	.hero .kick{margin-bottom:12px;font-size:.78rem}
	.hero__h{margin-bottom:12px}
	.hero__lead{font-size:.95rem;line-height:1.65}
	.hero .ctas .btn--ghost{display:none}
	.hero .micro{gap:4px 14px;font-size:.8rem;margin-top:14px}
	.hero__grid{gap:22px}
	.win--hero .appbar{display:none}
	.hero .inv{padding:1em 1.1em 1.1em}
}
@media (max-width:480px) and (max-height:800px){
	.hero__h{font-size:1.9rem}
	.hero__lead{font-size:.9rem;line-height:1.6}
	.hero .ctas{margin-top:16px}
	.hero .ctas .btn--lg{--h:46px}
}
@media (max-width:420px){.inv__row{grid-template-columns:minmax(0,1fr) 2em 4.9em 5.6em}.inv__tot{min-width:13.5em}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* phones: details in the middle (owner rule) — hero */
@media (max-width:767px){
	.hero__copy{text-align:center;display:flex;flex-direction:column;align-items:center}
	.hero__lead{margin-inline:auto}
	.hero .ctas{justify-content:center;width:100%}
	.hero .micro{justify-content:center}
	.hero__stage{margin-inline:auto;width:100%}
}
/* hero: split layout (copy | product); inside the copy column everything is centred (owner) */
.hero{min-height:min(100svh,940px);display:flex;align-items:center}
.hero__copy{text-align:center;display:flex;flex-direction:column;align-items:center}
.hero__h,.hero__lead{text-wrap:balance}
.hero__lead{margin-inline:auto}
.hero .ctas,.hero .micro{justify-content:center}
.hero__stage{padding-bottom:clamp(110px,14vh,140px)}
@media (max-width:1023px){.hero__stage{padding-bottom:0}}

@media (prefers-reduced-motion:reduce){.night span,.night__grain{animation:none!important}}
/* focus ring that shows on emerald and on light */
.btn--pri:focus-visible,.final :focus-visible,.app--core a:focus-visible{outline:2px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px rgb(14 27 44/.55)}
main:focus{outline:none}

/* header with 6 menu items (Knowledge center added): never wraps — labels stay on one line, and on narrower desktops
   the preferences pill shrinks to the flag and the spacing tightens; below 1100 px the menu button takes over */
.nav__a,.signin,.hdr__cta,.prefs__btn{white-space:nowrap}
.nav{flex-wrap:nowrap;min-width:0}
@media (max-width:1440px){
	.nav__a{padding:0 10px;font-size:.92rem}
	.hdr__bar{gap:10px}
	.hdr .prefs__name,.hdr .prefs__sep,.hdr .prefs__thm{display:none}
	.hdr .prefs__btn{padding-inline:8px 6px;gap:5px}
}
@media (max-width:1280px){
	.nav__a{padding:0 8px;font-size:.88rem}
	.nav{margin-inline-start:2px}
	.hdr .prefs__lang{display:none}
}
@media (max-width:1180px) and (min-width:1101px){
	.nav__a{padding:0 6px;font-size:.86rem}
	.hdr__bar{gap:6px}
	.hdr .signin{padding-inline:12px}
}
/* Apps menu: the free tools under the apps */
.mega__tools{margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.mega__grid--tools{grid-template-columns:repeat(3,minmax(0,1fr))}
.mega__grid--tools .mega__app{align-items:center;padding:8px 10px}
.mega__grid--tools small{display:none}
.mega__grid--tools b{font-size:.9rem;line-height:1.35}
.mega__tools .mega__title{margin-bottom:4px}
.mega__tools .mega__all{margin-top:6px}
/* short laptop screens: the Apps menu keeps every app and tool visible (app descriptions hide, never cut) */
@media (max-height:880px){.mega__grid small{display:none}.mega__app{align-items:center;padding:8px 10px}}
.mega{max-height:calc(100vh - 96px);overflow-y:auto;overscroll-behavior:contain}
/* Apps menu: a solid panel (the page no longer shows through), clear edge and depth */
.mega__in{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 0 0 1px rgb(14 27 44/.08),0 24px 60px -18px rgb(14 27 44/.35),0 8px 18px -10px rgb(14 27 44/.18)}
:root[data-theme="dark"] .mega__in{background:#13243A;box-shadow:0 0 0 1px rgb(255 255 255/.08),0 24px 60px -18px rgb(0 0 0/.8)}
.mega__app:hover,.mega__app:focus-visible{background:var(--bg-3,#F1F4F2)}
:root[data-theme="dark"] .mega__app:hover,:root[data-theme="dark"] .mega__app:focus-visible{background:rgb(255 255 255/.06)}
.mega__tools{background:linear-gradient(180deg,rgb(14 122 92/.04),transparent);border-radius:0 0 16px 16px;margin-inline:-14px;margin-bottom:-14px;padding:12px 14px 14px}
.mega{border-radius:22px}
/* header, round 2: the menu never shrinks under the preferences pill (no overlap); the pill shows the country name and
   language only when the bar really has room (wide screens), otherwise the flag (+ language code from 1281 px) */
.hdr__bar>.nav{flex-shrink:0}
.hdr__bar>.tools{min-width:0}
/* the top bar's pill: flag + language (+ theme): the country's full name lives in its menu, so the bar never overflows */
.hdr .prefs__name,.hdr .prefs__sep{display:none}

/* ------------------------------------------------------------------ v3 (preview /?v=v3, preview.py): the floating WhatsApp chat and the
   footer's social icons. Both render only with v3 on, so the live pages are unchanged. */
.wa{position:fixed;z-index:39;inset-inline-end:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));display:grid;place-items:center;width:56px;height:56px;border-radius:50%;color:#fff;
	background:radial-gradient(circle at 30% 25%,#3BE07A,#1FAF54 60%,#128C3E);box-shadow:0 0 0 1px rgb(255 255 255/.35) inset,0 12px 26px -10px rgb(18 140 62/.75),0 2px 6px rgb(14 27 44/.18);
	transition:bottom .35s var(--ease,ease),transform .2s,box-shadow .2s}
.wa__i{width:30px;height:30px}
.wa:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgb(255 255 255/.35) inset,0 16px 30px -10px rgb(18 140 62/.85),0 2px 6px rgb(14 27 44/.18)}
.wa:focus-visible{outline:3px solid #EBC572;outline-offset:3px}
:root[data-theme="dark"] .wa{box-shadow:0 0 0 1px rgb(255 255 255/.22) inset,0 12px 26px -10px rgb(0 0 0/.8)}
@media (min-width:1024px){.wa{inset-inline-end:24px;bottom:24px}.has-wa .ftr__bottom{padding-inline-end:76px}}
/* phones: above the mobile CTA bar once it slides in (.mbar.is-on), never on it; the footer keeps room for both */
@media (max-width:720px){.mbar.is-on~.wa{bottom:calc(78px + env(safe-area-inset-bottom))}.wa{width:52px;height:52px}.wa__i{width:28px;height:28px}.has-wa .ftr{padding-bottom:calc(148px + env(safe-area-inset-bottom))}}
@media (prefers-reduced-motion:reduce){.wa{transition:none}.wa:hover{transform:none}}
@media print{.wa{display:none!important}}
.ftr__social{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.ftr__social a{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#D2DAE3;background:rgb(255 255 255/.05);box-shadow:0 0 0 1px rgb(255 255 255/.1) inset;transition:color .2s,background-color .2s}
.ftr__social a:hover{color:#fff;background:rgb(14 122 92/.55)}
.ftr__social a:focus-visible{outline:2px solid #7FD8B8;outline-offset:2px}
.ftr__social .i{width:18px;height:18px}
.mega__grid--tools:has(>li:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
.mega__ico.app--zatca{background:rgb(14 122 92/.12);color:var(--em-text)}
/* «Start now» (header.html .cta2, owner 2026-10-19): one pill; hover / click opens «free trial» or «sign in» */
.cta2{position:relative;display:inline-flex;flex:none}
.cta2__btn{gap:6px;padding-inline:18px 12px;border-radius:12px;cursor:pointer;font-weight:600}
.cta2__chev{width:16px;height:16px;opacity:.85;transition:transform .25s var(--ease)}
.cta2.is-open .cta2__chev{transform:rotate(180deg)}
.cta2__menu{position:absolute;z-index:60;top:calc(100% + 10px);inset-inline-end:0;display:grid;gap:6px;width:340px;padding:8px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px rgb(14 27 44/.07),0 28px 60px -20px rgb(14 27 44/.38),0 8px 18px -10px rgb(14 27 44/.16);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.98);transform-origin:top;transition:opacity .2s,transform .25s var(--ease),visibility .2s}
.cta2__menu::before{content:"";position:absolute;inset-inline:0;top:-12px;height:12px}
.cta2.is-open .cta2__menu,html:not(.js) .cta2:focus-within .cta2__menu{opacity:1;visibility:visible;transform:none}
.cta2__opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border-radius:14px;color:var(--ink);transition:background-color .2s,box-shadow .2s}
.cta2__opt:hover,.cta2__opt:focus-visible{background:rgb(14 27 44/.04);outline:none;box-shadow:0 0 0 1px rgb(14 27 44/.06) inset}
.cta2__opt b{display:block;font-size:.95rem;font-weight:600;line-height:1.35}
.cta2__opt small{display:block;font-size:.8rem;color:var(--ink-3);line-height:1.45}
.cta2__ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:var(--em-text);background:rgb(14 122 92/.1)}
.cta2__ico .i{width:18px;height:18px}
.cta2__go{width:16px;height:16px;color:var(--ink-4,#8E9AAA);transition:transform .2s var(--ease)}
.cta2__opt:hover .cta2__go{transform:translateX(3px)}
[dir="rtl"] .cta2__opt:hover .cta2__go{transform:scaleX(-1) translateX(3px)}
.cta2__opt--pri{color:#fff;background:linear-gradient(135deg,#1FA67D 0%,#0E7A5C 55%,#0A6249 100%);box-shadow:0 1px 0 rgb(255 255 255/.22) inset,0 12px 26px -14px rgb(14 122 92/.9)}
.cta2__opt--pri:hover,.cta2__opt--pri:focus-visible{background:linear-gradient(135deg,#22B287 0%,#0F8463 55%,#0A6249 100%);box-shadow:0 1px 0 rgb(255 255 255/.22) inset,0 14px 30px -12px rgb(14 122 92/.95)}
.cta2__opt--pri small{color:rgb(255 255 255/.82)}
.cta2__opt--pri .cta2__ico{color:#fff;background:rgb(255 255 255/.18)}
.cta2__opt--pri .cta2__go{color:#fff}
:root[data-theme="dark"] .cta2__menu{background:#13243A;box-shadow:0 0 0 1px rgb(255 255 255/.08),0 28px 60px -20px rgb(0 0 0/.85)}
:root[data-theme="dark"] .cta2__opt{color:#fff}
:root[data-theme="dark"] .cta2__opt:not(.cta2__opt--pri):hover,:root[data-theme="dark"] .cta2__opt:not(.cta2__opt--pri):focus-visible{background:rgb(255 255 255/.05);box-shadow:0 0 0 1px rgb(255 255 255/.07) inset}
:root[data-theme="dark"] .cta2__opt:not(.cta2__opt--pri) .cta2__ico{color:#7FD8B8;background:rgb(127 216 184/.12)}
@media (max-width:720px){.cta2{display:none}}
/* top bar polish (owner 2026-10-19): links centred between the logo and the actions, darker text, a dot for the
   current page; the preferences pill framed like the button */
@media (min-width:1101px){
	.hdr__bar>.nav{margin-inline:auto}
	.hdr__bar>.tools{margin-inline-start:0}
}
.nav__a{color:var(--ink-2);font-weight:500}
.nav__a:hover{color:var(--em-text)}
.nav__a[aria-current]::after{inset-inline:auto;left:50%;width:5px;height:5px;bottom:3px;margin-left:-2.5px;border-radius:50%;background:var(--em-light,#1FA67D)}
.nav__more{color:var(--ink-2)}
:root[data-theme="dark"] .nav__a{color:#D2DAE3}
:root[data-theme="dark"] .nav__a:hover,:root[data-theme="dark"] .nav__a[aria-current]{color:#7FD8B8}
.hdr .tools>.prefs__btn{height:42px;background:#fff;box-shadow:0 1px 2px rgb(14 27 44/.06),0 0 0 1px rgb(14 27 44/.09) inset}
:root[data-theme="dark"] .hdr .tools>.prefs__btn{background:rgb(255 255 255/.06);box-shadow:0 0 0 1px rgb(255 255 255/.12) inset}
/* industries inside the Apps menu (owner 2026-10-19): three compact columns, then the free tools band */
.mega__tools.mega__inds{margin-bottom:0;border-radius:0;background:none}
.mega__grid.mega__grid--tools.mega__grid--inds{grid-template-columns:repeat(3,minmax(0,1fr))}
/* the Apps menu as one wide panel under the whole bar (owner 2026-10-19: no scrolling): apps in four columns, then
   industries | free tools side by side. position:fixed resolves against .hdr__bar (its backdrop-filter makes it the
   containing block), so the panel spans exactly the bar. */
@media (min-width:1101px){
	.hdr .mega{position:fixed;top:calc(100% + 10px);inset-inline:0;width:auto;max-height:calc(100vh - var(--hh) - 30px)}
	.hdr .mega__in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:14px;padding:16px}
	.hdr .mega__in>.mega__title,.hdr .mega__in>.mega__grid,.hdr .mega__in>.mega__all{grid-column:1/-1}
	.hdr .mega__in>.mega__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
	.hdr .mega__in>.mega__tools{margin:12px 0 0;padding:12px 14px 14px;border:1px solid var(--line);border-radius:16px}
	.hdr .mega__in>.mega__tools:not(.mega__inds){background:linear-gradient(180deg,rgb(14 122 92/.05),transparent)}
	.hdr .mega__in>.mega__tools:only-of-type,.hdr .mega__in>.mega__tools:last-child:nth-child(4){grid-column:1/-1}
}
/* Arabic headings (owner 2026-10-19 «letters come over each other», whole site): Arabic glyphs reach far above and
   below the line, so every page heading gets room for two-line wraps; one rule here beats the per-page tight values
   tuned for Latin. The invoice generator's printable invoice (.ivd) keeps its own metrics. */
[lang="ar"] main :is(h1,h2,h3,.h1,.h2):not(.ivd *),[lang="ar"] footer h2{line-height:1.45!important}