@font-face{font-family:"Reem Kufi";src:url(fonts/reemkufi-arabic.woff2) format("woff2");font-weight:400 700;font-display:swap;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:"Reem Kufi";src:url(fonts/reemkufi-latin.woff2) format("woff2");font-weight:400 700;font-display:swap;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+2190-2199,U+2212}
@font-face{font-family:"Readex Pro";src:url(fonts/readexpro-latin.woff2) format("woff2");font-weight:300 700;font-display:swap;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+2190-2199,U+2212}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(fonts/plexar-400.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0020,U+00A0,U+0600-06FF,U+200C-200F,U+2010}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(fonts/plexar-700.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0020,U+00A0,U+0600-06FF,U+200C-200F,U+2010}
/* metric-matched local fallbacks (measured widths vs Noto Sans Arabic / Arial) so the swap does not shift layout */
@font-face{font-family:"Plex Fallback";src:local("Noto Sans Arabic"),local("NotoSansArabic-Regular");size-adjust:93.8%;ascent-override:115.7%;descent-override:44.2%;line-gap-override:0%;unicode-range:U+0020,U+00A0,U+0600-06FF,U+200C-200F,U+2010}
@font-face{font-family:"Readex Fallback";src:local("Arial"),local("Arimo"),local("Liberation Sans");size-adjust:107.5%;ascent-override:93%;descent-override:23.3%;line-gap-override:0%;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+2190-2199,U+2212}
@font-face{font-family:"Kufi Fallback";src:local("Arial"),local("Arimo"),local("Liberation Sans");size-adjust:93.6%;ascent-override:117.5%;descent-override:42.7%;line-gap-override:0%;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+2190-2199,U+2212}
:root{
  color-scheme:light;
  --wa:oklch(76.095% 0.2015 149.74);--teal:oklch(57.618% 0.0995 182.396);--teal-ink:oklch(40% 0.08 182);--deep:oklch(43.354% 0.0754 182.232);--deeper:oklch(33.127% 0.0566 182.303);--bubble:oklch(94.61% 0.072 131.55);--wall:oklch(92.52% 0.013 71.32);--meta:oklch(50% 0.22 261);
  --paper:oklch(97.96% 0.006 84.57);--card:oklch(99.2% 0.004 84);--ink:oklch(22.39% 0.023 180.9);--ink-1:oklch(42.02% 0.026 177.96);--ink-2:oklch(48% 0.024 177.62);--line:oklch(89.95% 0.015 80.7);--line-1:oklch(83.25% 0.02 80.11);
  --r:14px;--r-1:26px;--r-pill:999px;
  --shadow:0 1px 2px oklch(43.354% 0.0754 182.232 / .06),0 12px 28px oklch(43.354% 0.0754 182.232 / .08),0 32px 64px oklch(43.354% 0.0754 182.232 / .06);
  --display:"Reem Kufi","Kufi Fallback","Readex Pro",sans-serif;--sans:"Readex Pro","Readex Fallback","IBM Plex Sans Arabic","Plex Fallback",sans-serif;
  --glass:oklch(33.127% 0.0566 182.303 / .8);--focus:var(--meta);
  --ease:cubic-bezier(.22,1,.36,1);--ease-out:cubic-bezier(.23,1,.32,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --edge:clamp(18px,4vw,64px);--gap:clamp(64px,8vw,120px);--max:1220px
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:max(72px,calc(56px + env(safe-area-inset-top,0px)));scroll-padding-bottom:max(72px,calc(56px + env(safe-area-inset-bottom,0px)))}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.65;color:var(--ink);background:var(--deeper);-webkit-font-smoothing:antialiased}
html{background:var(--deeper)}
main{background:var(--paper)}
html[lang=ar]{--display:"IBM Plex Sans Arabic","Plex Fallback","Reem Kufi","Readex Pro","Readex Fallback",sans-serif;--sans:"IBM Plex Sans Arabic","Plex Fallback","Readex Pro","Readex Fallback",sans-serif}
html[lang=ar] body{line-height:1.85}
a{color:var(--meta)}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:8px}
nav,.hero,.deep,.cta-band,footer,#stickyCta,.pc.feat,.demo-shell{--focus:var(--bubble)}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:50;background:var(--deep);color:oklch(99% 0.004 84);padding:10px 16px;border-radius:10px}
.skip:focus{top:max(12px,env(safe-area-inset-top,0px))}
.container{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--edge)}
.num{unicode-bidi:isolate;direction:ltr;display:inline-block;font-variant-numeric:tabular-nums}
h1,h2,h3,.wordmark{font-family:var(--display)}
[data-d="90"]{--d:90ms}[data-d="120"]{--d:120ms}[data-d="180"]{--d:180ms}[data-d="270"]{--d:270ms}

/* glass: tint on the bar (Safari samples it for the toolbar), blur on ::before so the bar itself has no backdrop-filter (WebKit 319479) */
nav{position:sticky;top:0;z-index:30;padding-top:env(safe-area-inset-top,0px);background:var(--glass);color:oklch(99% 0.004 84);transition:box-shadow .25s var(--ease)}
nav::before,#stickyCta::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6)}
nav.scrolled{box-shadow:0 8px 30px oklch(0% 0 0 / .18)}
nav .container{display:flex;align-items:center;gap:8px;min-height:66px;min-width:0}
.logo{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;min-height:44px;min-width:0;flex:0 1 auto}
.mark{flex-shrink:0}
.mark img{display:block;width:38px;height:38px}
.wordmark{display:flex;align-items:baseline;gap:8px;line-height:1;min-width:0}
.wm-ar{font-size:1.625rem;font-weight:700;white-space:nowrap}
.wm-en{font-size:.9375rem;font-weight:500;opacity:.75;letter-spacing:.02em;white-space:nowrap}
nav .links{margin-inline-start:auto;display:flex;gap:2px;align-items:center;flex-shrink:0;min-width:0}
nav .links .btn,nav .links .lang{white-space:nowrap;flex-shrink:0}
.navlink{display:none;color:oklch(99% 0.004 84 / .82);text-decoration:none;font-size:.9375rem;padding:10px 14px;min-height:44px;align-items:center;border-radius:var(--r-pill);transition:background .2s ease,color .2s ease}
@media (hover:hover) and (pointer:fine){.navlink:hover{background:oklch(99% 0.004 84 / .1);color:oklch(99% 0.004 84)}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:var(--r-pill);padding:14px 24px;min-height:44px;font:inherit;font-weight:600;font-size:.96875rem;line-height:1.2;cursor:pointer;text-decoration:none;transition:transform .15s var(--ease),background .2s ease,box-shadow .25s var(--ease),color .2s ease}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--wa);color:oklch(27.911% 0.0465 181.244);box-shadow:0 10px 24px oklch(76.095% 0.2015 149.74 / .28)}
@media (hover:hover) and (pointer:fine){.btn-primary:hover{background:oklch(80.1% 0.195 151.3);transform:translateY(-1px)}}
.btn-light{background:oklch(99% 0.004 84 / .1);color:oklch(99% 0.004 84);box-shadow:inset 0 0 0 1px oklch(99% 0.004 84 / .28)}
@media (hover:hover) and (pointer:fine){.btn-light:hover{background:oklch(99% 0.004 84 / .18)}}
.btn-ghost{background:var(--card);color:var(--deep);box-shadow:inset 0 0 0 1.5px var(--teal)}
@media (hover:hover) and (pointer:fine){.btn-ghost:hover{background:var(--deep);color:oklch(99% 0.004 84)}}
.btn .arr{transition:transform .25s var(--ease)}
@media (hover:hover) and (pointer:fine){.btn:hover .arr{transform:translateX(4px)}}
html[dir=rtl] .btn .arr{transform:scaleX(-1)}
@media (hover:hover) and (pointer:fine){html[dir=rtl] .btn:hover .arr{transform:scaleX(-1) translateX(4px)}}
.btn-sm{padding:10px 16px;font-size:.875rem;min-height:44px;min-width:44px}
.lang{background:oklch(99% 0.004 84 / .12);color:oklch(99% 0.004 84)}
.btn-primary.quiet{background:oklch(99% 0.004 84 / .12);color:oklch(99% 0.004 84);box-shadow:none}
@media (hover:hover) and (pointer:fine){.lang:hover{background:oklch(99% 0.004 84 / .2)}}

.hero{position:relative;color:oklch(99% 0.004 84);background:linear-gradient(165deg,var(--deep),var(--deeper));padding:clamp(28px,4vw,56px) 0 clamp(36px,5vw,72px);overflow:hidden;overflow:clip;isolation:isolate}
.hero-grid{display:grid;gap:clamp(28px,4vw,48px);align-items:center}
@media(min-width:1000px){.hero-grid{grid-template-columns:.9fr 1.1fr}}
.eyebrow{display:inline-flex;align-items:center;background:oklch(99% 0.004 84 / .1);border:1px solid oklch(99% 0.004 84 / .18);border-radius:var(--r-pill);padding:6px 14px;font-size:.8125rem;font-weight:600;letter-spacing:.03em;color:oklch(92% 0.04 149)}
.hero h1{font-size:clamp(2rem,4.2vw,3.25rem);line-height:1.1;font-weight:700;margin:14px 0 12px;text-wrap:balance;max-width:16ch}
html[lang=ar] .hero h1{line-height:1.3;letter-spacing:0;font-size:clamp(1.875rem,4vw,2.875rem)}
.lead{margin:0;color:oklch(99% 0.004 84 / .8);font-size:clamp(1rem,1.3vw,1.125rem);max-width:42ch}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 16px}
.trust{display:flex;flex-wrap:wrap;gap:10px 18px;margin:0;padding:0;list-style:none}
.trust li{font-size:.8125rem;color:oklch(99% 0.004 84 / .78);padding:0}
.trust li{display:inline-flex;align-items:center;gap:6px}
.trust li::before,.ticks li::before{content:"";flex:none;width:15px;height:10px;background:oklch(75.49% 0.117 229.73);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='m1 6.1 2.9 2.9 6-6.6M6.9 8.5l.5.5 6-6.6' fill='none' stroke='%23000' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='m1 6.1 2.9 2.9 6-6.6M6.9 8.5l.5.5 6-6.6' fill='none' stroke='%23000' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

.phone-stage{display:flex;justify-content:center;align-items:flex-end;position:relative;min-width:0;min-height:0;padding-block:4px 30px;overflow-x:clip}
/* Closed foldable (D-shape): hardware is physical LTR, chat UI uses logical props. Scale via --k, never zoom. */
.phone{
  --k:1;--u:calc(var(--k) * 1px);
  --duo-h:calc(380 * var(--u));--duo-ar:.72;
  --spine:calc(6 * var(--u));--btn:calc(2.5 * var(--u));--rim:calc(3.5 * var(--u));--bezel:calc(6 * var(--u));
  --r-hinge:calc(7 * var(--u));--r-free:calc(46 * var(--u));--punch:calc(12 * var(--u));
  --ti-hi:#6f8297;--ti-1:#465569;--ti-2:#283342;--ti-3:#18212d;--ti-4:#0d131b;
  --wa-head:#008069;--wa-green:#00a884;--wa-out:#d9fdd3;--wa-wall:#efeae2;--wa-ink:#111b21;--wa-meta:#667781;--wa-icon:#54656f;--wa-tick:#53bdeb;--wa-link:#027eb5;
  position:relative;z-index:2;flex:none;isolation:isolate;
  width:calc(var(--duo-h) * var(--duo-ar) + 2 * (var(--rim) + var(--bezel)) + var(--spine) + var(--btn));
  height:calc(var(--duo-h) + 2 * (var(--rim) + var(--bezel)));
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;line-height:normal;
}
html[lang=ar] .phone{font-family:"IBM Plex Sans Arabic",system-ui,"Segoe UI",sans-serif}
.phone svg{display:block;flex:none;fill:currentColor}
.duo-sprite{position:absolute;width:0;height:0;overflow:hidden}
.duo-shadow{
  position:absolute;z-index:-2;pointer-events:none;left:10%;right:2%;bottom:calc(-26 * var(--u));height:calc(40 * var(--u));
  background:radial-gradient(closest-side,oklch(16% 0.05 185 / .6),oklch(16% 0.05 185 / .2) 60%,transparent);filter:blur(7px)
}
.duo-spine{
  position:absolute;z-index:0;left:0;top:calc(5 * var(--u));bottom:calc(5 * var(--u));width:calc(var(--spine) + 10px);border-radius:4px 2px 2px 4px;
  background:repeating-linear-gradient(0deg,oklch(100% 0 0 / .018) 0 1px,transparent 1px 3px),linear-gradient(90deg,var(--ti-4) 0%,var(--ti-1) 18%,var(--ti-hi) 30%,var(--ti-2) 52%,var(--ti-3) 78%,var(--ti-4) 100%);
  box-shadow:inset 0 0 0 .5px oklch(0% 0 0 / .7),-1px 0 2px oklch(10% 0.03 200 / .5)
}
.duo-spine::before,.duo-spine::after{content:"";position:absolute;left:0;width:calc(var(--spine) + 1px);height:calc(11 * var(--u));background:linear-gradient(90deg,#0a0f15,#3e4b5c 35%,#556579 50%,#1d2631 85%);box-shadow:inset 0 0 0 .5px oklch(0% 0 0 / .6)}
.duo-spine::before{top:0;border-radius:4px 0 0 0;border-bottom:.5px solid oklch(0% 0 0 / .8)}
.duo-spine::after{bottom:0;border-radius:0 0 0 4px;border-top:.5px solid oklch(0% 0 0 / .8)}
/* hardware buttons and antenna bands are pseudo-element paint, not DOM */
.phone::before,.phone::after{content:"";position:absolute;z-index:0;--tb:linear-gradient(180deg,var(--ti-hi),var(--ti-2) 55%,var(--ti-3))}
.phone::before{top:-2.5px;left:47%;width:27.5%;height:6px;border-radius:2px 2px 0 0;background:var(--tb) 0 0/45.45% 100% no-repeat,var(--tb) 100% 0/45.45% 100% no-repeat}
.phone::after{right:0;top:31%;width:6px;height:15.5%;border-radius:0 2px 2px 0;background:linear-gradient(90deg,var(--ti-3),var(--ti-2) 40%,var(--ti-hi) 75%,var(--ti-3));box-shadow:inset 0 0 0 .5px oklch(0% 0 0 / .6)}
.duo-body{
  position:absolute;z-index:1;inset:0 var(--btn) 0 var(--spine);
  border-radius:var(--r-hinge) var(--r-free) var(--r-free) var(--r-hinge);
  background:linear-gradient(158deg,var(--ti-1) 0%,var(--ti-2) 20%,var(--ti-3) 55%,var(--ti-2) 82%,var(--ti-1) 100%);
  box-shadow:
    inset 0 0 0 .6px #070b10,inset 0 0 0 1.4px oklch(62% 0.03 245 / .9),inset 0 0 0 2.4px oklch(34% 0.03 250),inset 0 0 0 3.5px oklch(20% 0.02 250),
    0 1px 1px oklch(12% 0.03 200 / .5),0 8px 14px -6px oklch(18% 0.05 190 / .55),0 24px 40px -14px oklch(18% 0.06 186 / .6),0 54px 80px -34px oklch(18% 0.06 184 / .7)
}
.duo-body::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(135deg,oklch(92% 0.02 240 / .55) 0%,oklch(85% 0.02 240 / .12) 18%,transparent 40%,transparent 72%,oklch(80% 0.02 240 / .18) 92%,oklch(90% 0.02 240 / .35) 100%)}
.duo-body::before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;--ant:oklch(46% 0.02 245 / .75);background:linear-gradient(var(--ant),var(--ant)) 17% 0/3px var(--rim),linear-gradient(var(--ant),var(--ant)) 83% 0/3px var(--rim),linear-gradient(var(--ant),var(--ant)) 35% 100%/3px var(--rim),linear-gradient(var(--ant),var(--ant)) 65% 100%/3px var(--rim),linear-gradient(var(--ant),var(--ant)) 100% 14%/var(--rim) 3px,linear-gradient(var(--ant),var(--ant)) 100% 86%/var(--rim) 3px;background-repeat:no-repeat}
.duo-bezel{
  position:absolute;z-index:3;inset:var(--rim);
  border-radius:calc(var(--r-hinge) - var(--rim)) calc(var(--r-free) - var(--rim)) calc(var(--r-free) - var(--rim)) calc(var(--r-hinge) - var(--rim));
  background:radial-gradient(120% 90% at 20% 0%,#15181c,#030405 60%);
  box-shadow:inset 0 0 0 .5px oklch(100% 0 0 / .07),inset 0 1px 1px oklch(100% 0 0 / .05)
}
.phone-inner{
  position:absolute;inset:var(--bezel);overflow:hidden;display:flex;flex-direction:column;color:var(--wa-ink);background:var(--wa-wall);
  border-radius:calc(2 * var(--u)) calc(var(--r-free) - var(--rim) - var(--bezel)) calc(var(--r-free) - var(--rim) - var(--bezel)) calc(2 * var(--u))
}
.duo-glass{position:absolute;inset:0;z-index:20;pointer-events:none;border-radius:inherit;background:linear-gradient(118deg,oklch(100% 0 0 / .13) 0%,oklch(100% 0 0 / .04) 26%,transparent 38%),linear-gradient(300deg,oklch(100% 0 0 / .05) 0%,transparent 22%);box-shadow:inset 0 0 0 .6px oklch(0% 0 0 / .55),inset 0 0 5px oklch(0% 0 0 / .18)}
/* punch lives inside the status bar row, never the header */
.duo-punch{
  position:absolute;z-index:21;top:calc(8 * var(--u));right:calc(14 * var(--u));width:var(--punch);height:var(--punch);border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 36% 34%,oklch(62% 0.08 260 / .7) 0 1px,transparent 1.6px),radial-gradient(circle at 50% 50%,oklch(22% 0.04 260) 0 2.2px,#020203 3.4px);
  box-shadow:0 0 0 1px #000,0 0 0 1.6px oklch(30% 0.01 250 / .6)
}
.lc-statusbar{
  direction:ltr;flex:none;height:calc(28 * var(--u));display:flex;align-items:center;justify-content:space-between;
  padding:calc(1 * var(--u)) calc(14 * var(--u) + var(--punch) + 10 * var(--u)) 0 calc(16 * var(--u));
  background:var(--wa-head);color:#fff;font-size:calc(11 * var(--u));font-weight:600;font-variant-numeric:tabular-nums
}
.lc-sys{display:flex;align-items:center;gap:calc(4 * var(--u))}
.lc-sys svg{width:calc(13 * var(--u));height:calc(9 * var(--u))}
.lc-sys svg:last-child{width:calc(20 * var(--u))}
.lc-head{
  flex:none;height:calc(44 * var(--u));display:flex;align-items:center;min-width:0;position:relative;z-index:2;
  padding-inline:calc(3 * var(--u)) calc(10 * var(--u));background:var(--wa-head);color:#fff;box-shadow:0 1px 1.5px oklch(0% 0 0 / .12)
}
.lc-back{width:calc(15 * var(--u));height:calc(28 * var(--u));display:grid;place-items:center;flex:none}
.lc-back svg{width:calc(16 * var(--u));height:calc(16 * var(--u))}
html[dir=rtl] .lc-back svg{transform:scaleX(-1)}
.lc-head img{width:calc(30 * var(--u));height:calc(30 * var(--u));flex:none;border-radius:50%;background:#fff;padding:calc(2 * var(--u));margin-inline-start:calc(2 * var(--u))}
.lc-id{flex:1;min-width:0;margin-inline:calc(8 * var(--u)) calc(4 * var(--u));display:flex;flex-direction:column;gap:calc(1 * var(--u))}
.lc-title{display:flex;align-items:center;gap:calc(3 * var(--u));white-space:nowrap}
.lc-name{font-size:calc(13 * var(--u));font-weight:600;line-height:calc(16 * var(--u));letter-spacing:-.012em;white-space:nowrap}
html[lang=ar] .lc-name{letter-spacing:0}
.lc-verified{width:calc(12 * var(--u));height:calc(12 * var(--u))}
.lc-status{display:block;font-size:calc(11 * var(--u));line-height:calc(13 * var(--u));min-height:calc(13 * var(--u));color:#fff;white-space:nowrap}
.lc-calls{display:flex;align-items:center;gap:calc(13 * var(--u));flex:none}
.lc-calls svg:first-child{width:calc(19 * var(--u));height:calc(19 * var(--u))}
.lc-calls svg:last-child{width:calc(17 * var(--u));height:calc(17 * var(--u))}
.lc-log{
  flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:calc(5 * var(--u));overflow:hidden;overflow:clip;contain:strict;
  padding:calc(6 * var(--u)) calc(11 * var(--u)) calc(4 * var(--u));transition:opacity .4s var(--ease);
  --dd:oklch(45% 0.03 70 / .085);background-color:var(--wa-wall);
  background-image:
    radial-gradient(circle at 30% 30%,transparent 3px,var(--dd) 3.4px 4.3px,transparent 4.7px),
    radial-gradient(circle at 50% 100%,transparent 4px,var(--dd) 4.4px 5.3px,transparent 5.7px),
    radial-gradient(ellipse 5px 1.8px at 62% 22%,var(--dd) 70%,transparent 100%),
    radial-gradient(circle at 78% 68%,var(--dd) 1.3px,transparent 1.8px),
    radial-gradient(circle at 12% 82%,var(--dd) 1px,transparent 1.5px),
    radial-gradient(ellipse 1.6px 4.5px at 88% 30%,var(--dd) 70%,transparent 100%);
  background-size:58px 62px,44px 48px,50px 54px,58px 62px,34px 38px,66px 70px;
  background-position:0 0,23px 9px,9px 31px,13px 21px,7px 3px,31px 17px
}
.lc-log.fade{opacity:0}
.lc-msg{
  position:relative;flex:none;max-width:80%;padding:calc(4 * var(--u)) calc(7 * var(--u)) calc(5 * var(--u)) calc(8 * var(--u));border-radius:calc(7 * var(--u));
  font-size:calc(12.5 * var(--u));line-height:calc(16 * var(--u));overflow-wrap:anywhere;unicode-bidi:plaintext;color:var(--wa-ink);
  filter:drop-shadow(0 .6px .4px oklch(20% 0.02 220 / .16));
  opacity:0;transform:translateY(8px) scale(.97);transition:opacity .28s var(--ease),transform .28s var(--ease)
}
.phone .lc-msg:not(.in){transform:translateY(8px) scale(.97)}
.lc-msg.in{opacity:1;transform:none}
.lc-msg.me{align-self:flex-end;background:var(--wa-out);border-start-end-radius:0}
.lc-msg.bot{align-self:flex-start;background:#fff;border-start-start-radius:0}
.lc-msg::before{content:"";position:absolute;top:0;width:calc(8 * var(--u));height:calc(12 * var(--u));background:inherit}
.lc-msg.me::before{inset-inline-end:calc(-7 * var(--u));clip-path:polygon(0 0,100% 0,88% 9%,0 100%)}
.lc-msg.bot::before{inset-inline-start:calc(-7 * var(--u));clip-path:polygon(0 0,100% 0,100% 100%,12% 9%)}
html[dir=rtl] .lc-msg.me::before{clip-path:polygon(0 0,100% 0,100% 100%,12% 9%)}
html[dir=rtl] .lc-msg.bot::before{clip-path:polygon(0 0,100% 0,88% 9%,0 100%)}
/* time + ticks tuck into the last line via an inline spacer */
.lc-text::after{content:"";display:inline-block;width:calc(46 * var(--u));height:1px}
.lc-msg.me .lc-text::after{width:calc(64 * var(--u))}
.lc-meta{position:absolute;inset-inline-end:calc(7 * var(--u));bottom:calc(3 * var(--u));display:flex;align-items:center;gap:calc(3 * var(--u));font-size:calc(11 * var(--u));line-height:1;color:var(--wa-meta);white-space:nowrap}
.lc-ticks{
  display:block;width:calc(15 * var(--u));height:calc(10 * var(--u));font-size:0;color:#8696a0;background:currentColor;transition:color .25s var(--ease);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='m1 6.1 2.9 2.9 6-6.6M6.9 8.5l.5.5 6-6.6' fill='none' stroke='%23000' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 11'%3E%3Cpath d='m1 6.1 2.9 2.9 6-6.6M6.9 8.5l.5.5 6-6.6' fill='none' stroke='%23000' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat
}
.lc-msg.read .lc-ticks{color:var(--wa-tick)}
/* interactive reply buttons */
.lc-msg.has-slots,.lc-msg:has(.lc-slots){display:flex;flex-direction:column;width:80%;padding-bottom:0}
.lc-msg.has-slots .lc-text::after,.lc-msg:has(.lc-slots) .lc-text::after{display:none}
.lc-msg.has-slots .lc-meta,.lc-msg:has(.lc-slots) .lc-meta{position:static;order:1;align-self:flex-end;margin:calc(2 * var(--u)) 0 calc(3 * var(--u))}
.lc-slots{order:2;display:block;margin-inline:calc(-8 * var(--u)) calc(-7 * var(--u));border-top:1px solid #e9edef}
.lc-slots span{display:flex;align-items:center;justify-content:center;gap:calc(5 * var(--u));height:calc(29 * var(--u));color:var(--wa-link);font-size:calc(12.5 * var(--u));font-weight:500;unicode-bidi:isolate}
.lc-slots span + span{border-top:1px solid #e9edef}
.lc-slots span::before{
  content:"";width:calc(13 * var(--u));height:calc(13 * var(--u));background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5 2 7.5l4 4M2.6 7.5H10a4 4 0 0 1 4 4V13' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5 2 7.5l4 4M2.6 7.5H10a4 4 0 0 1 4 4V13' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat
}
html[dir=rtl] .lc-slots span::before{transform:scaleX(-1)}
.lc-slots span.on{background:#f5f6f6}
.lc-typing{display:flex;gap:calc(3 * var(--u));padding:calc(9 * var(--u)) calc(10 * var(--u))}
.lc-typing i{width:calc(6 * var(--u));height:calc(6 * var(--u));border-radius:50%;background:#8696a0;animation:dot 1.2s cubic-bezier(.45,0,.55,1) infinite}
.lc-typing i:nth-child(2){animation-delay:.15s}.lc-typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,70%,100%{opacity:.4;transform:none}35%{opacity:1;transform:translateY(-2px)}}
/* physical padding: the big free-edge corner is on the right in EN and AR */
.phone-composer{flex:none;display:flex;align-items:flex-end;gap:calc(5 * var(--u));padding:calc(3 * var(--u)) calc(13 * var(--u)) calc(9 * var(--u)) calc(7 * var(--u));background:var(--wa-wall)}
.lc-field{flex:1;min-width:0;height:calc(36 * var(--u));display:flex;align-items:center;gap:calc(9 * var(--u));padding-inline:calc(9 * var(--u)) calc(11 * var(--u));border-radius:calc(18 * var(--u));background:#fff;color:var(--wa-icon);box-shadow:0 .6px .6px oklch(0% 0 0 / .1)}
.lc-field span{flex:1;min-width:0;font-size:calc(13 * var(--u));color:#8696a0;white-space:nowrap}
.lc-field svg{width:calc(19 * var(--u));height:calc(19 * var(--u))}
.lc-mic{width:calc(36 * var(--u));height:calc(36 * var(--u));flex:none;display:grid;place-items:center;border-radius:50%;background:var(--wa-green);color:#fff;box-shadow:0 1px 1.5px oklch(0% 0 0 / .2)}
.lc-mic svg{width:calc(18 * var(--u));height:calc(18 * var(--u))}
@media(min-width:1000px){
  .phone{--k:1.2}
  .phone-stage{min-height:540px}
}
/* below desktop the device (incl. side button) scales to fit the stage, so nothing protrudes past the edge */
@supports (width:1cqi){
  @media(max-width:999px){.phone-stage{container-type:inline-size}.phone{--u:min(1px,calc(100cqi / 302))}}
}
@supports not (width:1cqi){@media(max-width:360px){.phone{--k:.9}}}
@media (prefers-reduced-motion:reduce){
  .phone .lc-msg,.phone .lc-msg:not(.in){opacity:1;transform:none;transition:none}
  .lc-typing i{animation:none}
  .lc-typing i:nth-child(2){opacity:.7}.lc-typing i:nth-child(3){opacity:.4}
}
.float-chip{position:absolute;background:var(--card);color:var(--ink);border-radius:14px;padding:10px 12px;font-size:.8125rem;box-shadow:var(--shadow);z-index:1;max-width:112px}
.float-chip b{display:block;font-size:.75rem;color:var(--teal-ink)}
.float-chip .chip-time{white-space:nowrap;unicode-bidi:isolate}
.fc1{inset-inline-start:0;top:18%}
.fc2{inset-inline-end:0;top:42%}
.fc3{inset-inline-start:0;bottom:14%}
@media(min-width:1000px){
  .phone-stage{padding-inline:clamp(64px,9vw,120px)}
  .fc1{inset-inline-start:0;top:22%}
  .fc2{inset-inline-end:0;top:48%}
  .fc3{inset-inline-start:0;bottom:18%}
}
@media(max-width:999px){.float-chip{display:none}}

section{padding:var(--gap) 0}
.sec-head{margin-bottom:clamp(20px,2.5vw,36px)}
h2{font-size:clamp(1.625rem,3.4vw,2.5rem);font-weight:700;line-height:1.15;margin:0 0 8px;text-wrap:balance;max-width:18ch}
html[lang=ar] h2{line-height:1.4;letter-spacing:0}
.sub{color:var(--ink-1);margin:0;max-width:520px;font-size:clamp(.9375rem,1.2vw,1.0625rem)}
.note{font-size:.84375rem;color:var(--ink-2)}
.wall{background:var(--wall);background-image:radial-gradient(oklch(43.354% 0.0754 182.232 / .06) 1.2px,transparent 1.2px);background-size:20px 20px}
.deep{background:linear-gradient(oklch(33.127% 0.0566 182.303 / .92),oklch(33.127% 0.0566 182.303 / .96)),image-set(url(img/band-1280.avif?v=59f4fd92) type("image/avif"),url(img/band-1280.webp?v=c5dea21b) type("image/webp")) center/cover no-repeat var(--deeper);color:oklch(99% 0.004 84)}
.deep h2{color:oklch(99% 0.004 84)}
section#products,section#pricing,section#why{background:var(--paper)}

#products{padding-top:clamp(40px,5vw,72px)}
/* Agents bento: static port of kokonutd "Bento Grid" (21st.dev/kokonutd/bento-grid, MIT). <760px it is its own snap scroller so it never widens the page. */
.bento{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--edge);margin-inline:calc(-1 * var(--edge));padding:4px var(--edge) 24px;scrollbar-width:none}
.bento::-webkit-scrollbar{display:none}
.bento:focus-visible{outline-offset:-3px;border-radius:20px}
.bc{position:relative;isolation:isolate;flex:0 0 min(84%,340px);min-width:0;scroll-snap-align:start;display:flex;flex-direction:column;gap:16px;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 1px 2px oklch(43.354% 0.0754 182.232 / .05);transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out),border-color .25s var(--ease-out)}
.bc::before{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle,oklch(43.354% 0.0754 182.232 / .09) 1px,transparent 1px) 0 0/5px 5px;opacity:0;transition:opacity .25s var(--ease-out)}
.bc-feat{background:linear-gradient(160deg,oklch(95.5% 0.035 150),var(--card) 55%);border-color:oklch(85% 0.05 160)}
.bc-feat::before{opacity:1}
@media (hover:hover) and (pointer:fine){
  .bc:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-1)}
  .bc:hover::before{opacity:1}
}
.bc-body{display:flex;flex-direction:column;min-width:0;flex:1}
.bc-top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.bc-ic{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:oklch(57.618% 0.0995 182.396 / .12);color:var(--teal-ink)}
.bc-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.bc-tag{font-size:.8125rem;font-weight:500;color:var(--ink-1);background:oklch(43.354% 0.0754 182.232 / .07);border-radius:8px;padding:4px 10px;min-width:0}
.bc-idx{margin-inline-start:auto;font:600 .8125rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink-2)}
.bc h3{margin:0;font-size:1.375rem;line-height:1.25}
.bc .who{font-size:.875rem;color:var(--ink-1);margin:2px 0 8px}
.bc-desc{margin:0 0 14px;font-size:.9375rem;color:var(--ink-1);line-height:1.5}
html[lang=ar] .bc-desc{line-height:1.85}
.ticks{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;font-size:.9375rem;color:var(--ink-1)}
.ticks li{padding-inline-start:26px;position:relative}
.ticks li::before{position:absolute;inset-inline-start:0;top:.55em;background:var(--teal)}
.bc-foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px dashed var(--line-1)}
.price-hint{font-family:var(--display);font-size:1.625rem;font-weight:700;line-height:1.2;color:var(--ink)}
.price-hint small{font-family:var(--sans);font-size:.875rem;font-weight:400;color:var(--ink-1)}
/* mini WhatsApp previews: fixed height, no protruding tails */
.mc{order:-1;flex:none;height:256px;display:flex;flex-direction:column;overflow:hidden;border-radius:14px;border:1px solid oklch(43.354% 0.0754 182.232 / .12);background:#efeae2 radial-gradient(oklch(45% 0.03 70 / .09) 1px,transparent 1.2px) 0 0/14px 14px;color:#111b21;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.78125rem;line-height:1.38}
html[lang=ar] .mc{font-family:"IBM Plex Sans Arabic",system-ui,sans-serif;line-height:1.5}
.mc-head{flex:none;display:flex;align-items:center;gap:8px;height:42px;padding-inline:10px;background:#008069;color:#fff}
.mc-av{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#00664f;font-weight:700;font-size:.75rem}
.mc-id{min-width:0;display:flex;flex-direction:column;line-height:1.2}
.mc-id b{font-size:.8125rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-id small{font-size:.6875rem;color:#fff}
.mc-log{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;padding:8px 10px 10px;overflow:hidden}
.mc-b{align-self:flex-start;max-width:86%;padding:5px 8px;border-radius:8px;border-start-start-radius:2px;background:#fff;box-shadow:0 .5px .6px oklch(20% 0.02 220 / .16);overflow-wrap:anywhere}
.mc-b.me{align-self:flex-end;background:#d9fdd3;border-start-start-radius:8px;border-start-end-radius:2px}
.mc-t{display:inline-block;margin-inline-start:6px;font-size:.625rem;color:#4f5f69;unicode-bidi:isolate;white-space:nowrap;vertical-align:-1px}
.mc-opts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.mc-opts span{padding:2px 8px;border-radius:999px;background:#fff;border:1px solid #d1d7db;color:#00664f;font-weight:600;font-size:.6875rem;white-space:nowrap;unicode-bidi:isolate}
.mc-opts .on{background:#00664f;border-color:#00664f;color:#fff}
.mc-pay{display:flex;align-items:center;justify-content:center;gap:6px;margin:6px -8px -5px;padding:6px 8px;border-top:1px solid #e9edef;color:#025f8a;font-weight:600}
.mc-pay svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html[dir=rtl] .mc-pay svg{transform:scaleX(-1)}
.mc-sys{align-self:center;max-width:92%;padding:3px 9px;border-radius:7px;background:#fdf4c5;color:#4f5f69;font-size:.6875rem;font-weight:500;text-align:center}
.mc bdi{unicode-bidi:isolate}
@media(min-width:760px){
  .bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;overflow:visible;margin:0;padding:0;scroll-snap-type:none}
  .bc{padding:20px}
  .bc-feat{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(18px,3vw,36px);align-items:stretch}
  .bc-feat .mc{order:0;height:auto;min-height:300px;font-size:.875rem}
  .bc-feat h3{font-size:clamp(1.5rem,2.4vw,2rem)}
}

#pricing{background:var(--wall);background-image:radial-gradient(oklch(43.354% 0.0754 182.232 / .05) 1.2px,transparent 1.2px);background-size:18px 18px}
.price-bento{display:grid;gap:10px}
@media(min-width:800px){.price-bento{grid-template-columns:repeat(8,1fr)}}
.pc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:10px;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
@media(min-width:800px){.pc.feat{grid-column:span 5}.pc.s1{grid-column:span 3}.pc.s2{grid-column:span 4}.pc.s3{grid-column:span 4}}
.pc.feat{background:var(--deep);color:oklch(99% 0.004 84);border:0}
.pc .badge{font-size:.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--bubble);color:var(--deep);padding:4px 10px;border-radius:999px;align-self:flex-start}
.pc.feat .badge{background:oklch(25% 0.05 182 / .35);color:var(--bubble)}
.pc .m{font-family:var(--display);font-size:clamp(1.75rem,3vw,2.5rem);font-weight:700;line-height:1.1}
.pc .m small{font-family:var(--sans);font-size:.875rem;font-weight:400;opacity:.75}
.pc ul{list-style:none;padding:0;margin:0;display:grid;gap:6px;font-size:.84375rem;opacity:.92}
.pc ul li{padding-inline-start:20px;position:relative}
.pc ul li::before{content:"✓";position:absolute;inset-inline-start:0;color:var(--wa);font-weight:700}
.pilot{font-size:.8125rem;background:var(--bubble);color:var(--deep);border-radius:10px;padding:8px 10px}
.pc.feat .pilot{background:oklch(94.61% 0.072 131.55 / .15);color:var(--bubble)}
.pr-note{margin-top:16px;max-width:820px}

#demo .demo-wrap{display:grid;gap:24px}
@media(min-width:900px){#demo .demo-wrap{grid-template-columns:1fr 1fr;align-items:center}}
.prompts{list-style:none;padding:0;margin:14px 0;display:grid;gap:6px}
.prompts li{background:var(--bubble);border-radius:10px;border-start-end-radius:3px;padding:8px 12px;font-size:.875rem;unicode-bidi:plaintext}
.demo-shell{display:grid;border-radius:22px;padding:6px;background:var(--deeper)}
.demo-shell>*{grid-area:1/1}
.demo-load{align-self:center;justify-self:center;margin:0;color:oklch(99% 0.004 84 / .8);font-size:.875rem}
.demo-frame{position:relative;display:block;width:100%;height:420px;border:0;border-radius:18px;background:transparent}
@media(max-width:759px){.demo-frame{height:480px}}

.steps{list-style:none;padding:0;margin:0;display:grid;gap:10px;counter-reset:step}
@media(min-width:760px){.steps{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{padding:16px;border-radius:14px;background:oklch(99% 0.004 84 / .06);border:1px solid oklch(99% 0.004 84 / .1);font-size:.90625rem;color:oklch(99% 0.004 84 / .88)}
.steps li{counter-increment:step}
.steps li::before{content:counter(step);display:inline-block;font-family:var(--display);font-weight:700;color:var(--wa);margin-inline-end:8px}
html[lang=ar] .steps li::before{content:counter(step,arabic-indic)}

.why{display:grid;gap:16px}
@media(min-width:760px){.why{grid-template-columns:repeat(3,1fr)}}
.why>div{padding:16px 0;border-top:2px solid var(--teal)}
.why b{display:block;font-family:var(--display);font-size:1.125rem;margin:4px 0}
.why p{margin:0;color:var(--ink-1);font-size:.90625rem}
.w-n{font-size:.8125rem;font-weight:600;color:var(--teal-ink)}

.book-grid{display:grid;gap:28px}
@media(min-width:900px){.book-grid{grid-template-columns:1fr 1.1fr}}
.faq-h{font-size:1.25rem;margin:32px 0 6px}
details{border-bottom:1px solid var(--line-1)}
summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;font-weight:600;font-size:1rem;cursor:pointer;padding:14px 0;min-height:44px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;background:var(--card);display:grid;place-items:center;font-size:1.125rem;transition:transform .25s var(--ease),background .2s ease}
details[open] summary::after{transform:rotate(45deg);background:var(--bubble)}
details p{margin:0 0 14px;color:var(--ink-1);font-size:.90625rem}
form.lead-form{display:grid;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:clamp(18px,2.5vw,28px);box-shadow:var(--shadow)}
label{font-weight:500;font-size:.875rem;display:grid;gap:6px;color:var(--ink-1)}
input,select,textarea{font:inherit;font-size:1rem;color:var(--ink);padding:12px 14px;border:1px solid var(--line-1);border-radius:var(--r);background:var(--paper);width:100%;transition:border-color .2s ease,box-shadow .2s ease}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px oklch(57.618% 0.0995 182.396 / .45)}
input,select,textarea{scroll-margin-block:max(88px,calc(72px + env(safe-area-inset-top,0px))) 120px}
.row2{display:grid;gap:12px}
@media(min-width:600px){.row2{grid-template-columns:1fr 1fr}}
.consent{font-weight:400;font-size:.84375rem;display:flex;gap:8px;align-items:flex-start;cursor:pointer;position:relative;padding-block:4px}
.consent input{appearance:auto;width:22px;height:22px;margin:0;accent-color:var(--teal);flex:none;position:relative;z-index:1}
.consent .chk{flex:none;display:grid;place-items:center;width:44px;height:44px;margin-block:-6px;margin-inline-start:-6px}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.status{font-size:.875rem;min-height:20px}.status.ok{color:var(--teal-ink)}.status.err{color:oklch(50.13% 0.178 28.7)}
.bt-other[hidden]{display:none}
#leadForm{scroll-margin-top:max(88px,calc(72px + env(safe-area-inset-top,0px)))}

.cta-band{background:var(--deeper);color:oklch(99% 0.004 84);padding:clamp(40px,5vw,72px) 0;text-align:center}
.cta-band h2{margin-inline:auto;max-width:16ch}

#stickyCta{position:fixed;inset-inline:0;bottom:0;z-index:35;transform:translateY(110%);transition:transform .28s var(--ease);background:var(--glass);color:oklch(99% 0.004 84);padding:10px var(--edge) max(10px,env(safe-area-inset-bottom,0px));border-top:1px solid oklch(99% 0.004 84 / .1)}
#stickyCta.show{transform:none}
#stickyCta .inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:12px;justify-content:space-between}
#stickyCta p{margin:0;font-size:.875rem;opacity:.88}
@media(max-width:759px){#stickyCta p{display:none}}

footer{background:var(--deeper);color:oklch(99% 0.004 84 / .75);padding:48px 0 max(88px,calc(64px + env(safe-area-inset-bottom,0px)));font-size:.875rem}
footer a{color:var(--bubble)}
footer a,.lead-form .note a{display:inline-flex;align-items:center;min-height:44px;vertical-align:middle}
footer .note{color:oklch(99% 0.004 84 / .6)}
.foot-grid{display:grid;gap:22px}
footer p{margin:0 0 6px}

.credits{font-size:.75rem;color:var(--ink-2);padding:20px 0;border-top:1px solid var(--line)}
.credits a{color:var(--teal-ink)}

@media(min-width:760px){.navlink{display:inline-flex}}
@media(max-width:759px){nav .container{min-height:60px}.wm-en{display:none}}
@media(max-width:380px){
  nav .container{gap:6px}
  .mark img{width:34px;height:34px}
  .wm-ar{font-size:1.375rem}
  nav .links{gap:4px}
  nav .links .btn-sm{padding:10px 12px;font-size:.8125rem}
  nav .links .lang{padding:10px 12px;font-size:.8125rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal,.lc-msg{opacity:1;transform:none;translate:none}
  .bc,.bc:hover{transform:none}
}
.nf{min-height:100dvh;display:grid;place-items:center;text-align:center;padding:24px}
.nf-box{max-width:560px;display:grid;gap:28px;justify-items:center}
.nf-code{margin:0;font-family:var(--display);font-size:clamp(4rem,14vw,7.5rem);font-weight:700;line-height:1;color:var(--wa)}
.nf h1{font-size:clamp(1.625rem,4vw,2.25rem);margin:0 0 8px}
.nf p{color:oklch(99% 0.004 84 / .8);margin:0 0 16px}
.nf .nf-ar{background:transparent;color:oklch(99% 0.004 84);border:1px solid oklch(99% 0.004 84 / .4)}
.nf section{padding:0}
.nf [lang=ar]{--display:"IBM Plex Sans Arabic","Reem Kufi","Readex Pro",sans-serif;--sans:"IBM Plex Sans Arabic","Readex Pro",sans-serif;font-family:var(--sans);line-height:1.85}
.pc .pilot-note{margin:0}
.pc.feat .note{color:oklch(99% 0.004 84 / .82)}
.pc .m-sm{font-size:1.75rem}
.cta-band .cta-gap{margin-top:18px}

html[lang=ar] .eyebrow,html[lang=ar] .pc .badge{letter-spacing:0;text-transform:none}

footer .credits{border:0;padding:8px 0 0;color:oklch(99% 0.004 84 / .68)}
footer .credits a{color:var(--bubble)}