/* Tarleaks public site — one stylesheet for every generated page.
   Source of truth: this file (hand-written, committed). Spec: docs/programs/website-v2/ux-research.md §6.
   Rules: tokens on :root; dark theme under prefers-color-scheme (unless the visitor chose light) and under
   [data-theme="dark"]; logical properties only (the same rules mirror under dir="rtl"); content is visible
   without JavaScript (html.js marks progressive enhancements). */
@layer reset, tokens, base, layout, components, utilities, overrides;

/* ------------------------------------------------------------------ fonts */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;
  src:url(/assets-site/fonts/plus-jakarta-sans-latin-wght.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Kufi Arabic";font-style:normal;font-weight:100 900;font-display:swap;
  src:url(/assets-site/fonts/noto-kufi-arabic-wght.woff2) format("woff2");
  unicode-range:U+0600-06FF,U+200C-200F,U+2010-2011,U+FE70-FEFF}
/* Size-matched fallbacks so the swap does not shift the layout. */
@font-face{font-family:"Jakarta Fallback";src:local("Arial"),local("Helvetica"),local("Liberation Sans");
  size-adjust:104%;ascent-override:100%;descent-override:21%;line-gap-override:0%}
@font-face{font-family:"Kufi Fallback";src:local("Tahoma"),local("Segoe UI"),local("Noto Sans Arabic"),local("Arial");
  size-adjust:108%;ascent-override:118%;descent-override:42%;line-gap-override:0%}

@layer reset{
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
img,svg,video,canvas{display:block;max-inline-size:100%;block-size:auto}
input,button,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
ul[role="list"],ol[role="list"]{list-style:none}
[hidden]{display:none!important}
table{border-collapse:collapse}
:where(summary){cursor:pointer}
}

/* ----------------------------------------------------------------- tokens */
@layer tokens{
:root{
  color-scheme:light;
  --bg:#ffffff;--surface-1:#fafbfc;--surface-2:#f1f2f6;--border:#e0e3ea;--border-strong:#c9cdd8;
  --text:#14161d;--text-2:#4a5164;--text-3:#5f6678;
  --brand:#1f54d6;--brand-hover:#1a47b8;--brand-soft:#eef3ff;--on-brand:#ffffff;
  --success-text:#15803d;--warn-text:#b45309;--danger-text:#c0362c;
  --success-soft:#ecfdf3;--warn-soft:#fff7ed;--danger-soft:#fef2f2;
  --focus:#1f54d6;--focus-inner:#ffffff;
  --shadow-raised:0 1px 2px rgba(20,22,29,.06),0 2px 8px rgba(20,22,29,.06);
  --shadow-overlay:0 12px 40px rgba(20,22,29,.16),0 2px 8px rgba(20,22,29,.08);
  --header-bg:rgba(255,255,255,.9);
  /* actors on workflow steps */
  --actor-0:#1d4ed8;--actor-1:#c2410c;--actor-2:#15803d;--actor-3:#7e22ce;--actor-4:#be185d;--actor-5:#0e7490;--actor-6:#a16207;--actor-7:#475569;
  /* type */
  --font-sans:"Plus Jakarta Sans","Jakarta Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-ar:"Noto Kufi Arabic","Kufi Fallback","Plus Jakarta Sans",Tahoma,"Segoe UI",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --fs-h1:clamp(32px,4.5vw,56px);--fs-h2:clamp(26px,3vw,38px);--fs-h3:clamp(19px,1.8vw,24px);
  --fs-body:17px;--fs-small:14px;--fs-legal:13px;
  --lh-body:1.65;--lh-h1:1.1;--lh-h2:1.2;--lh-h3:1.3;
  /* space, shape, motion */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:64px;--s-9:96px;--s-10:128px;
  --section-pad:clamp(48px,8vw,112px);
  --r-xs:6px;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-pill:999px;
  --dur-1:120ms;--dur-2:200ms;--dur-3:320ms;--ease:cubic-bezier(.2,.7,.2,1);
  --header-h:64px;--gutter:clamp(16px,3vw,32px);
  --container:1200px;--container-wide:1440px;--container-docs:1800px;--reading:72ch;
  --z-header:40;--z-mega:45;--z-sticky:50;--z-drawer:60;--z-overlay:70;--z-toast:80;
  --target:44px;
  /* legacy names still used by generated bodies and the role-guide styles */
  --surface:var(--bg);--surface-3:var(--surface-2);--border-2:var(--border);
  --link:var(--brand);--link-strong:var(--brand-hover);--text-4:var(--text-3);
  --yes:var(--success-text);--no:var(--danger-text);--part:var(--warn-text);
  --sidebar-active-bg:var(--brand-soft);--sidebar-active-fg:var(--brand);
  --card-hover-border:#93b0ff;--code-bg:var(--surface-2);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0a0c12;--surface-1:#13151e;--surface-2:#1e2230;--border:#2c3142;--border-strong:#3d4459;
    --text:#e9ebf2;--text-2:#c3cae0;--text-3:#949ab0;
    --brand:#7aa2ff;--brand-hover:#9db8ff;--brand-soft:#172242;--on-brand:#0a0c12;
    --success-text:#4ade80;--warn-text:#fbbf52;--danger-text:#f98a82;
    --success-soft:#0f2a1b;--warn-soft:#2e2210;--danger-soft:#2e1414;
    --focus:#93b0ff;--focus-inner:#0a0c12;
    --shadow-raised:0 1px 2px rgba(0,0,0,.4),0 2px 8px rgba(0,0,0,.3);
    --shadow-overlay:0 12px 40px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4);
    --header-bg:rgba(10,12,18,.88);
    --actor-0:#7aa2ff;--actor-1:#fb923c;--actor-2:#4ade80;--actor-3:#c084fc;--actor-4:#f472b6;--actor-5:#22d3ee;--actor-6:#fbbf24;--actor-7:#94a3b8;
    --card-hover-border:#4a64b8;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0a0c12;--surface-1:#13151e;--surface-2:#1e2230;--border:#2c3142;--border-strong:#3d4459;
  --text:#e9ebf2;--text-2:#c3cae0;--text-3:#949ab0;
  --brand:#7aa2ff;--brand-hover:#9db8ff;--brand-soft:#172242;--on-brand:#0a0c12;
  --success-text:#4ade80;--warn-text:#fbbf52;--danger-text:#f98a82;
  --success-soft:#0f2a1b;--warn-soft:#2e2210;--danger-soft:#2e1414;
  --focus:#93b0ff;--focus-inner:#0a0c12;
  --shadow-raised:0 1px 2px rgba(0,0,0,.4),0 2px 8px rgba(0,0,0,.3);
  --shadow-overlay:0 12px 40px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4);
  --header-bg:rgba(10,12,18,.88);
  --actor-0:#7aa2ff;--actor-1:#fb923c;--actor-2:#4ade80;--actor-3:#c084fc;--actor-4:#f472b6;--actor-5:#22d3ee;--actor-6:#fbbf24;--actor-7:#94a3b8;
  --card-hover-border:#4a64b8;
}
}

/* ------------------------------------------------------------------- base */
@layer base{
html{scroll-padding-block-start:calc(var(--header-h) + 16px);overflow-x:clip}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text);background:var(--bg);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-block-size:100vh;overflow-x:clip}
:lang(ar) body,html[lang="ar"] body{font-family:var(--font-ar);font-size:calc(var(--fs-body) + 1px);line-height:1.85}
h1,h2,h3,h4{color:var(--text);text-wrap:balance;font-weight:700}
h1{font-size:var(--fs-h1);line-height:var(--lh-h1);letter-spacing:-.02em}
h2{font-size:var(--fs-h2);line-height:var(--lh-h2);letter-spacing:-.01em}
h3{font-size:var(--fs-h3);line-height:var(--lh-h3)}
h4{font-size:17px;line-height:1.35}
html[lang="ar"] :is(h1,h2,h3,h4){letter-spacing:0;font-weight:700}
html[lang="ar"] h1{font-size:calc(var(--fs-h1) + 2px);line-height:1.35}
html[lang="ar"] h2{font-size:calc(var(--fs-h2) + 1px);line-height:1.4}
html[lang="ar"] h3{font-size:calc(var(--fs-h3) + 1px);line-height:1.5}
p,li,dd{text-wrap:pretty}
p{color:var(--text-2)}
a{color:var(--brand);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--brand-hover);text-decoration-thickness:2px}
strong,b{font-weight:700;color:var(--text)}
html[lang="ar"] :is(em,i){font-style:normal}
code,kbd,samp,pre{font-family:var(--font-mono);font-size:.88em}
code{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-xs);padding:.05em .4em;
  direction:ltr;unicode-bidi:isolate;overflow-wrap:anywhere;color:var(--text)}
pre{direction:ltr;text-align:left;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:var(--s-4);overflow-x:auto;margin-block:var(--s-4);line-height:1.55;position:relative}
pre code{background:none;border:0;padding:0;font-size:14px;overflow-wrap:normal}
hr{border:0;border-block-start:1px solid var(--border);margin-block:var(--s-6)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;box-shadow:0 0 0 2px var(--focus-inner)}
[tabindex="-1"]:focus{outline:none}
::selection{background:color-mix(in srgb,var(--brand) 25%,transparent)}
}

/* ----------------------------------------------------------------- layout */
@layer layout{
.container{inline-size:100%;max-inline-size:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.container-wide{inline-size:100%;max-inline-size:var(--container-docs);margin-inline:auto;padding-inline:var(--gutter)}
.container-reading{inline-size:100%;max-inline-size:calc(880px + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
main.page{padding-block:var(--s-6) var(--s-8);min-block-size:50vh}
main.page--wide{inline-size:100%;max-inline-size:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
main.page > * + *{margin-block-start:var(--s-4)}
main.page :is(h2){margin-block-start:var(--s-7)}
main.page :is(h3){margin-block-start:var(--s-5)}
main.page :is(p,ul,ol){max-inline-size:var(--reading)}

/* docs: sidebar + article */
.docs-layout{display:grid;grid-template-columns:clamp(220px,18vw,290px) minmax(0,1fr);align-items:start}
.docs-side{position:sticky;inset-block-start:var(--header-h);max-block-size:calc(100vh - var(--header-h));overflow-y:auto;
  padding-block:var(--s-5) var(--s-7);padding-inline-end:var(--s-4);border-inline-end:1px solid var(--border);font-size:14.5px;
  overscroll-behavior:contain}
.docs-side .cap,.docs-mnav .cap{font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);
  margin-block:var(--s-5) var(--s-2);padding-inline:10px}
html[lang="ar"] :is(.docs-side,.docs-mnav) .cap{text-transform:none;letter-spacing:0;font-size:13.5px}
.docs-side .cap:first-child{margin-block-start:0}
:is(.docs-side,.docs-mnav) a{display:block;padding:6px 10px;margin-block:1px;border-radius:var(--r-xs);color:var(--text-2);
  text-decoration:none;line-height:1.45}
:is(.docs-side,.docs-mnav) a:hover{background:var(--surface-2);color:var(--text)}
:is(.docs-side,.docs-mnav) a.on{background:var(--brand-soft);color:var(--brand);font-weight:650}
.docs-main{min-inline-size:0;padding-block:var(--s-6) var(--s-8);padding-inline-start:clamp(20px,3vw,56px)}
.docs-main > :is(p,ul,ol),.docs-main article :is(p,ul,ol,dl){max-inline-size:var(--reading)}
.docs-main article :is(table,figure,.rolebar,.tags,.rolelinks,.tablewrap) :is(p,ul,ol,dl){max-inline-size:none}
.docs-main h1{font-size:clamp(30px,3.4vw,44px);line-height:1.15}
html[lang="ar"] .docs-main h1{font-size:clamp(32px,3.6vw,46px);line-height:1.4}
.docs-main h2{font-size:clamp(23px,2.2vw,30px)}
.docs-main :is(h2){margin-block:var(--s-7) var(--s-3)}
.docs-main :is(h3){margin-block:var(--s-5) var(--s-2)}
.docs-main p{margin-block:0 var(--s-3)}
.docs-mnav{display:none;margin-block-end:var(--s-5);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-1)}
.docs-mnav > summary{padding:12px 16px;font-weight:650;color:var(--text);min-block-size:var(--target);display:flex;align-items:center}
.docs-mnav > div{padding:6px 8px 12px;border-block-start:1px solid var(--border);max-block-size:60vh;overflow:auto}
@media (max-width:959.98px){
  .docs-layout{display:block}
  .docs-side{display:none}
  .docs-main{padding-inline-start:0}
  .docs-mnav{display:block}
  :is(.docs-side,.docs-mnav) a{padding-block:10px;min-block-size:var(--target)}
}
@media (min-width:1800px){.docs-main{padding-inline-start:clamp(40px,4vw,80px)}}
.docs-main section.cat,.docs-main .xgrid{content-visibility:auto;contain-intrinsic-size:auto 600px}
}

/* ------------------------------------------------------------- components */
@layer components{
/* skip link (C06) */
.skip-link{position:absolute;inset-inline-start:var(--s-3);inset-block-start:-100px;z-index:100;padding:10px 16px;
  background:var(--bg);color:var(--text);border:2px solid var(--focus);border-radius:var(--r-sm);font-weight:650;text-decoration:none}
.skip-link:focus{inset-block-start:var(--s-3)}

/* icons */
.icon{inline-size:1.15em;block-size:1.15em;flex:none}
.icon-chev{inline-size:14px;block-size:14px;transition:transform var(--dur-1) var(--ease)}
html[dir="rtl"] .icon-dir{transform:scaleX(-1)}

/* brand */
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-weight:750;font-size:18px;
  min-block-size:var(--target);font-family:var(--font-sans);letter-spacing:-.01em;flex:none}
.brand:hover{color:var(--text);text-decoration:none}
.logo-mark{inline-size:30px;block-size:30px;border-radius:9px}

/* buttons (C31) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-block-size:var(--target);padding:10px 18px;
  border-radius:var(--r-sm);font-weight:650;font-size:15.5px;line-height:1.2;text-decoration:none;border:1px solid transparent;
  transition:background var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),color var(--dur-1) var(--ease);
  white-space:nowrap;cursor:pointer;text-align:center}
.btn:hover{text-decoration:none}
.btn--primary{background:var(--brand);color:var(--on-brand)}
.btn--primary:hover{background:var(--brand-hover);color:var(--on-brand)}
.btn--secondary{background:var(--bg);color:var(--text);border-color:var(--border-strong)}
.btn--secondary:hover{border-color:var(--brand);color:var(--brand)}
.btn--tertiary{background:none;color:var(--brand);padding-inline:6px}
.btn--l{min-block-size:52px;padding:14px 24px;font-size:16.5px;border-radius:var(--r-md)}
.btn--block{display:flex;inline-size:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;margin-block:var(--s-4)}
.btn[disabled],.btn[aria-busy="true"]{opacity:.7;cursor:progress}
/* legacy name */
.cta{display:inline-flex;align-items:center;min-block-size:var(--target);padding:10px 20px;border-radius:var(--r-sm);
  background:var(--brand);color:var(--on-brand);font-weight:650;text-decoration:none}
.cta:hover{background:var(--brand-hover);color:var(--on-brand);text-decoration:none}

/* header (C01) */
.site-header{position:sticky;inset-block-start:0;z-index:var(--z-header);background:var(--header-bg);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-block-end:1px solid var(--border)}
.site-header__bar{display:flex;align-items:center;gap:var(--s-4);block-size:var(--header-h);max-inline-size:var(--container-wide);
  transition:block-size var(--dur-2) var(--ease)}
.site-header.is-compact .site-header__bar{block-size:56px}
.mainnav{flex:1 1 auto;min-inline-size:0}
.mainnav__list{display:flex;align-items:center;gap:2px;list-style:none}
.mainnav__trigger,.mainnav__link{display:inline-flex;align-items:center;gap:6px;min-block-size:var(--target);padding:8px 12px;
  border-radius:var(--r-xs);color:var(--text-2);font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap}
.mainnav__trigger:hover,.mainnav__link:hover,.mainnav__trigger[aria-expanded="true"]{color:var(--text);background:var(--surface-2)}
.mainnav__trigger[aria-current],.mainnav__link[aria-current]{color:var(--text);box-shadow:inset 0 -2px 0 var(--brand)}
.mainnav__trigger[aria-expanded="true"] .icon-chev{transform:rotate(180deg)}
.site-header__tools{display:flex;align-items:center;gap:var(--s-2);margin-inline-start:auto;flex:none}
.lang-switch{display:inline-flex;align-items:center;gap:6px;min-block-size:var(--target);padding:8px 10px;border-radius:var(--r-xs);
  color:var(--text-2);text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap}
.lang-switch:hover{color:var(--text);background:var(--surface-2);text-decoration:none}
.lang-switch[lang="ar"]{font-family:var(--font-ar)}
.lang-switch[lang="en"]{font-family:var(--font-sans)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-inline-size:var(--target);min-block-size:var(--target);
  border-radius:var(--r-xs);color:var(--text-2);border:1px solid transparent}
.theme-toggle:hover{color:var(--text);background:var(--surface-2)}
.theme-toggle .theme-icon{display:none}
.theme-toggle[data-mode="system"] .theme-icon--system,.theme-toggle:not([data-mode]) .theme-icon--system,
.theme-toggle[data-mode="light"] .theme-icon--light,.theme-toggle[data-mode="dark"] .theme-icon--dark{display:block}
.theme-toggle--wide{padding-inline:12px;border-color:var(--border)}
.theme-toggle__text:empty{display:none}
.signin{display:inline-flex;align-items:center;min-block-size:var(--target);padding:8px 10px;color:var(--text);font-weight:650;
  font-size:15px;text-decoration:none;white-space:nowrap}
.signin:hover{color:var(--brand);text-decoration:none}
.header-cta{font-size:15px;padding-inline:16px}
/* R69: "Book a demo" is a quiet link beside Sign in; the free trial stays the one filled button */
.hdemo{color:var(--text-2)}
@media (max-width:1279.98px){.hdemo{display:none}}
.burger{display:none;align-items:center;justify-content:center;inline-size:var(--target);block-size:var(--target);
  border-radius:var(--r-xs);color:var(--text);margin-inline-start:auto}
.burger .icon{inline-size:24px;block-size:24px}
.burger:hover{background:var(--surface-2)}
.js-only{display:none!important}
html.js .js-only{display:inline-flex!important}
html.js .nojs-only{display:none!important}

/* mega panel (C02) */
.mainnav__item{position:static}
.mega{display:none;position:absolute;inset-inline:0;inset-block-start:100%;z-index:var(--z-mega);background:var(--bg);
  border-block-end:1px solid var(--border);box-shadow:var(--shadow-overlay);max-block-size:calc(100vh - var(--header-h));overflow-y:auto}
html:not(.js) .mainnav__item:hover > .mega,html:not(.js) .mainnav__item:focus-within > .mega{display:block}
.mainnav__trigger[aria-expanded="true"] + .mega{display:block}
.mega__inner{padding-block:var(--s-5) var(--s-5);max-inline-size:var(--container-wide)}
.mega__grid{display:grid;gap:var(--s-5) var(--s-6);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:start}
.mega__grid--platform{grid-template-columns:minmax(220px,1fr) minmax(0,3fr) minmax(220px,1fr)}
.mega__pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4) var(--s-5)}
.mega__cap{font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);margin-block-end:var(--s-2)}
html[lang="ar"] .mega__cap{text-transform:none;letter-spacing:0;font-size:13.5px}
.mega__list{list-style:none;display:grid;gap:2px}
.mega__link{display:block;padding:8px 10px;border-radius:var(--r-xs);text-decoration:none;color:var(--text)}
.mega__link:hover{background:var(--surface-2);color:var(--text);text-decoration:none}
.mega__list--apps .mega__link{padding-block:6px;font-weight:550;color:var(--text-2)}
.mega__list--apps .mega__link:hover{color:var(--text)}
.mega__label{display:block;font-weight:650;font-size:15px}
.mega__desc{display:block;color:var(--text-3);font-size:13.5px;line-height:1.45;margin-block-start:2px}
.mega__feature{display:flex;flex-direction:column;gap:6px;padding:var(--s-4);border-radius:var(--r-md);background:var(--surface-1);
  border:1px solid var(--border);text-decoration:none;color:var(--text)}
.mega__feature:hover{border-color:var(--card-hover-border);text-decoration:none;color:var(--text)}
.mega__feature-title{font-weight:700;font-size:16px}
.mega__goto{display:inline-flex;align-items:center;gap:6px;margin-block-start:var(--s-4);font-weight:650;min-block-size:var(--target);
  text-decoration:none}
.mega__goto:hover{text-decoration:underline}
.eyebrow{display:block;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
html[lang="ar"] .eyebrow{text-transform:none;letter-spacing:0;font-size:13.5px}
.en-marker{display:inline-block;font-size:11px;font-weight:700;line-height:1;padding:3px 5px;border-radius:4px;
  border:1px solid var(--border-strong);color:var(--text-3);vertical-align:middle;margin-inline-start:4px;font-family:var(--font-sans)}

/* mobile drawer (C03) */
.drawer{position:fixed;inset-block:0;inset-inline-end:0;inset-inline-start:auto;margin:0;max-block-size:none;block-size:100%;
  inline-size:min(420px,100vw);max-inline-size:100vw;padding:0;border:0;background:var(--bg);color:var(--text);
  box-shadow:var(--shadow-overlay);display:none;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
.drawer[open]{display:flex}
.drawer::backdrop{background:rgba(10,12,18,.45)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:10px var(--s-4);
  border-block-end:1px solid var(--border);position:sticky;inset-block-start:0;background:var(--bg);z-index:1}
.drawer__close{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--target);block-size:var(--target);
  border-radius:var(--r-xs);color:var(--text)}
.drawer__close:hover{background:var(--surface-2)}
.drawer__nav{padding:var(--s-2) var(--s-4);flex:1 0 auto}
.drawer__group{border-block-end:1px solid var(--border)}
.drawer__group > summary{display:flex;align-items:center;justify-content:space-between;min-block-size:52px;font-weight:700;
  font-size:17px;list-style:none}
.drawer__group > summary::-webkit-details-marker{display:none}
.drawer__group[open] > summary .icon-chev{transform:rotate(180deg)}
.drawer__panel{padding-block:0 var(--s-4)}
.drawer__cap{font-size:12.5px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.05em;margin-block:var(--s-3) var(--s-1)}
html[lang="ar"] .drawer__cap{text-transform:none;letter-spacing:0;font-size:13.5px}
.drawer__list{list-style:none}
.drawer__link{display:flex;flex-direction:column;justify-content:center;min-block-size:var(--target);padding:8px 4px;color:var(--text);
  text-decoration:none;font-weight:600}
.drawer__link .mega__desc{font-weight:400}
.drawer__goto{display:inline-flex;align-items:center;gap:6px;min-block-size:var(--target);font-weight:650;text-decoration:none}
.drawer__plain{padding-inline:var(--s-4)}
.drawer__toplink{display:flex;align-items:center;min-block-size:52px;font-weight:700;font-size:17px;color:var(--text);text-decoration:none;
  border-block-end:1px solid var(--border)}
.drawer__row{display:flex;flex-wrap:wrap;gap:var(--s-2);padding:var(--s-3) var(--s-4)}
.drawer__row .lang-switch{border:1px solid var(--border)}
.drawer__cta{position:sticky;inset-block-end:0;padding:var(--s-3) var(--s-4) calc(var(--s-3) + env(safe-area-inset-bottom));
  background:var(--bg);border-block-start:1px solid var(--border)}
html.drawer-open,html.drawer-open body{overflow:hidden}

@media (max-width:959.98px){
  .mainnav,.site-header__tools{display:none}
  .burger{display:inline-flex}
  html.js .burger.js-only{display:inline-flex!important}
}
@media (min-width:960px){
  .burger,html.js .burger.js-only,.burger.nojs-only{display:none!important}
}
@media (max-width:1180px) and (min-width:960px){
  .signin{display:none}
  .mainnav__trigger,.mainnav__link{padding-inline:9px}
}

/* footer (C04) */
.site-footer{margin-block-start:var(--s-8);border-block-start:1px solid var(--border);background:var(--surface-1);
  padding-block:var(--s-7) var(--s-5);font-size:15px}
.site-footer .container{max-inline-size:var(--container-wide)}
.site-footer__top{display:grid;grid-template-columns:minmax(220px,1fr) 3fr;gap:var(--s-6)}
.site-footer__brand p{color:var(--text-3);margin-block-start:var(--s-3);max-inline-size:34ch;font-size:14.5px}
.site-footer__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s-5)}
.fcol > summary{list-style:none;font-weight:700;color:var(--text);font-size:15px;margin-block-end:var(--s-2);display:flex;align-items:center;
  justify-content:space-between;pointer-events:none}
.fcol > summary::-webkit-details-marker{display:none}
.fcol > summary .icon-chev{display:none}
.fcol__list{list-style:none;display:grid;gap:2px}
.fcol__list a,.legal a{color:var(--text-2);text-decoration:none;display:inline-flex;align-items:center;min-block-size:32px}
.fcol__list a:hover,.legal a:hover{color:var(--brand);text-decoration:underline}
.site-footer__bottom{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-5);margin-block-start:var(--s-6);
  padding-block-start:var(--s-4);border-block-start:1px solid var(--border)}
.copyright{color:var(--text-3);font-size:14px}
.site-footer__follow{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-3);font-size:14px;color:var(--text-3)}
.site-footer__follow ul{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);list-style:none;margin:0;padding:0}
.site-footer__follow a{color:var(--text-2);text-decoration:none;display:inline-flex;align-items:center;min-block-size:32px}
.site-footer__follow a:hover{color:var(--brand);text-decoration:underline}
.legal{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);list-style:none;font-size:14px}
.site-footer__switches{display:flex;gap:var(--s-2);margin-inline-start:auto}
.site-footer__note{color:var(--text-3);font-size:13px;margin-block-start:var(--s-3);max-inline-size:none}
/* footer app QR codes: QR hidden on phones, buttons stay */
.appqr{margin-block-start:var(--s-4)}
.appqr__title{font-weight:700;color:var(--text);font-size:14.5px;margin:0 0 var(--s-2)}
.appqr__list{display:flex;gap:var(--s-4);list-style:none;margin:0;padding:0}
.appqr__item{display:flex;flex-direction:column;align-items:center;gap:var(--s-2)}
.appqr__qr{display:block;line-height:0;border-radius:8px;overflow:hidden;border:1px solid var(--border)}
.appqr__qr .qr{inline-size:104px;block-size:104px;display:block}
.appqr__btn{display:inline-flex;align-items:center;justify-content:center;min-block-size:var(--target,44px);padding-inline:var(--s-3);
  border:1px solid var(--border);border-radius:999px;color:var(--text);font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
.appqr__btn:hover{border-color:var(--text-3)}
@media (max-width:719.98px){
  .appqr__qr{display:none}
  .appqr__list{flex-wrap:wrap}
}
@media (max-width:719.98px){
  .site-footer__top{grid-template-columns:1fr;gap:var(--s-4)}
  .site-footer__cols{grid-template-columns:1fr;gap:0}
  .fcol{border-block-end:1px solid var(--border)}
  .fcol > summary{pointer-events:auto;min-block-size:var(--target);margin:0}
  .fcol > summary .icon-chev{display:block}
  .fcol[open] > summary .icon-chev{transform:rotate(180deg)}
  .fcol__list a,.legal a{min-block-size:var(--target)}
  .site-footer__switches{margin-inline-start:0}
}

/* breadcrumbs (C05) */
.crumbs{font-size:14px;color:var(--text-3);margin-block-end:var(--s-3)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;list-style:none;gap:2px 0}
.crumbs li{display:inline-flex;align-items:center}
.crumbs li + li::before{content:"›";padding-inline:8px;color:var(--text-3)}
html[dir="rtl"] .crumbs li + li::before{content:"‹"}
.crumbs a{color:var(--text-3);text-decoration:none}
.crumbs a:hover{color:var(--brand);text-decoration:underline}
.crumbs [aria-current]{color:var(--text-2)}
@media (max-width:719.98px){.crumbs a{display:inline-flex;align-items:center;min-block-size:var(--target)}}

/* lead, section head, notes */
.lead{font-size:clamp(18px,1.6vw,21px);line-height:1.6;color:var(--text-2);margin-block:var(--s-3) var(--s-5);max-inline-size:var(--reading)}
.section-head{max-inline-size:68ch;margin-block:var(--s-7) var(--s-4)}
.section-head h2{margin:0}
.section-lead{font-size:18px;color:var(--text-2);margin-block-start:var(--s-2)}
.note{font-size:14px;color:var(--text-3);margin-block-start:var(--s-3)}

/* cards (C11): one stretched link per card */
.cgrid,.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s-3);margin-block:var(--s-4) var(--s-5)}
.ccard,.card{position:relative;display:block;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--s-4);transition:border-color var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease);text-decoration:none;color:var(--text-2)}
.ccard:hover,a.card:hover{border-color:var(--card-hover-border);box-shadow:var(--shadow-raised)}
.ccard:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.ccard__title{font-size:16.5px;line-height:1.35;margin:0 0 6px}
.ccard__link{color:var(--text);text-decoration:none}
.ccard__link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.ccard__link:focus-visible{outline:none;box-shadow:none}
.ccard__text{font-size:14.5px;line-height:1.55;color:var(--text-3);margin:0}
.card b{display:block;color:var(--text);margin-block-end:5px;font-size:15.5px}
.card span{display:block;font-size:14px;color:var(--text-3);line-height:1.55}

/* chips (C24) and tags */
.chip{display:inline-flex;align-items:center;min-block-size:32px;padding:4px 12px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--bg);color:var(--text-2);font-size:14px;text-decoration:none}
a.chip:hover{border-color:var(--brand);color:var(--brand)}
nav.onpage{margin-block:var(--s-4) var(--s-2)}
nav.onpage .cap2{display:block;font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);margin-block-end:6px}
html[lang="ar"] nav.onpage .cap2{text-transform:none;letter-spacing:0;font-size:13.5px}
ul.chiprow{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;max-inline-size:none!important}
ul.chiprow a{display:inline-flex;align-items:center;min-block-size:36px;padding:4px 13px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--bg);color:var(--text-2);font-size:14px;line-height:1.4;text-decoration:none}
ul.chiprow a:hover{border-color:var(--brand);color:var(--brand)}
.tag{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap;font-size:13px;line-height:1.5;padding:1px 9px;border:1px solid var(--border);
  border-radius:var(--r-pill);color:var(--text-2);background:var(--surface-1)}
.tag.opt{border-color:var(--warn-text);color:var(--warn-text)}
.tag.beta{border-color:var(--brand)}
.tag.multi{border-color:var(--brand);color:var(--brand);font-weight:650;text-decoration:none}
a.tag.multi:hover{background:var(--brand-soft)}
.tag a.wlink{color:var(--brand)}

/* feature catalogue */
.catcount{font-size:16px;color:var(--text-2);margin-block:var(--s-2) var(--s-3)}
.catcount a{font-weight:650}
section.cat{margin-block-end:var(--s-2)}
section.cat > p.intro{color:var(--text-2);margin-block-end:6px}
ul.featlist{list-style:none;margin:0 0 12px;padding:0;max-inline-size:84ch!important}
ul.featlist li{padding-block:12px;border-block-end:1px solid var(--border);color:var(--text-2);overflow-wrap:anywhere}
ul.featlist li:last-child{border-block-end:0}
ul.featlist li b{color:var(--text)}
.ftags{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:8px}
.forline{display:block;font-size:14px;line-height:1.5;color:var(--text-3);margin-block-start:6px}
ul.feats{list-style:none;margin-block:var(--s-3);padding:0}
ul.feats li{padding-block:10px;padding-inline-start:28px;position:relative;border-block-end:1px solid var(--border);color:var(--text-2)}
ul.feats li:last-child{border-block-end:0}
ul.feats li::before{content:"✓";position:absolute;inset-inline-start:2px;color:var(--success-text);font-weight:700}
.xgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--s-3);margin-block:var(--s-3) var(--s-5)}
a.xcard{display:block;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);padding:14px 16px;color:var(--text-2);
  text-decoration:none;overflow-wrap:anywhere;transition:border-color var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease)}
a.xcard:hover{border-color:var(--card-hover-border);box-shadow:var(--shadow-raised)}
a.xcard .xt{display:block;font-weight:650;color:var(--text);margin-block-end:4px;font-size:16px;line-height:1.4}
a.xcard .xd{display:block;font-size:14.5px;color:var(--text-3);line-height:1.55}
.xmeta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-block-start:10px}
.mchip{display:inline-flex;align-items:center;font-size:13px;line-height:1.55;padding:2px 9px;border-radius:var(--r-xs);background:var(--surface-2);
  color:var(--text-2);border:1px solid var(--border);text-decoration:none}
a.mchip:hover{border-color:var(--brand);color:var(--brand)}
.howchip{display:inline-flex;align-items:center;font-size:13px;line-height:1.55;padding:2px 9px;border-radius:var(--r-pill);
  border:1px solid var(--brand);color:var(--brand);font-weight:650}
.dir{font-weight:700;color:var(--text-3);font-size:15px}
.pair{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-block:var(--s-2) var(--s-4)}
.pair .mchip{font-size:15px;padding:4px 12px;min-block-size:36px}
.pair .dir{font-size:18px}
.lbl2{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3);margin-inline-end:8px}
html[lang="ar"] .lbl2{text-transform:none;letter-spacing:0;font-size:13.5px}
ul.check{list-style:none;margin:0 0 12px;padding:0}
ul.check li{padding-block:6px;padding-inline-start:30px;position:relative}
ul.check li::before{content:"";position:absolute;inset-inline-start:2px;inset-block-start:.6em;inline-size:15px;block-size:15px;
  border:2px solid var(--text-3);border-radius:4px}
ol.steps{list-style:none;counter-reset:st;margin:12px 0 18px;padding:0;max-inline-size:84ch!important}
ol.steps > li{counter-increment:st;position:relative;border:1px solid var(--border);border-radius:var(--r-md);padding-block:14px 10px;
  padding-inline:56px 16px;margin:0 0 10px;background:var(--bg);overflow-wrap:anywhere}
ol.steps > li::before{content:counter(st);position:absolute;inset-inline-start:14px;inset-block-start:14px;inline-size:28px;block-size:28px;
  border-radius:50%;background:var(--brand);color:var(--on-brand);font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}
ol.steps .who{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-block-end:4px}
ol.steps .act{margin:2px 0 6px;color:var(--text)}
ol.steps .res{margin:0 0 6px;font-size:15.5px;color:var(--text-2);background:var(--surface-1);border-inline-start:3px solid var(--brand);
  border-start-end-radius:var(--r-sm);border-end-end-radius:var(--r-sm);padding:7px 11px}
.actor{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:650;line-height:1.5;padding:2px 11px;border-radius:var(--r-pill);
  border:1px solid var(--actor-c,var(--border));background:color-mix(in srgb,var(--actor-c,var(--text-3)) 10%,var(--bg));color:var(--text)}
.actor::before{content:"";flex:none;inline-size:8px;block-size:8px;border-radius:50%;background:var(--actor-c,var(--text-3))}
.actor-0{--actor-c:var(--actor-0)}.actor-1{--actor-c:var(--actor-1)}.actor-2{--actor-c:var(--actor-2)}.actor-3{--actor-c:var(--actor-3)}
.actor-4{--actor-c:var(--actor-4)}.actor-5{--actor-c:var(--actor-5)}.actor-6{--actor-c:var(--actor-6)}.actor-7{--actor-c:var(--actor-7)}
ul.linklist{list-style:none;margin:0 0 12px;padding:0}
ul.linklist li{padding-block:9px;border-block-end:1px solid var(--border)}
ul.linklist li:last-child{border-block-end:0}
ul.linklist .why{display:block;font-size:14.5px;color:var(--text-3)}
.arnote{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 14px;margin-block:var(--s-3)}
.next{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-block:var(--s-6) var(--s-2);padding-block-start:var(--s-4);
  border-block-start:1px solid var(--border);font-size:15px}
.next a{display:inline-flex;align-items:center;min-block-size:var(--target);font-weight:600}

/* callouts (C22) */
.callout{display:flex;gap:var(--s-3);background:var(--surface-1);border:1px solid var(--border);border-inline-start:4px solid var(--brand);
  border-radius:var(--r-sm);padding:12px 16px;margin-block:var(--s-4)}
.callout__icon{flex:none;inline-size:24px;block-size:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;background:var(--brand-soft);color:var(--brand)}
.callout__title{font-weight:700;color:var(--text);margin:0 0 2px}
.callout__body p{margin:0}
.callout--warning{border-inline-start-color:var(--warn-text)}.callout--warning .callout__icon{background:var(--warn-soft);color:var(--warn-text)}
.callout--legal{border-inline-start-color:var(--text-3)}.callout--legal .callout__icon{background:var(--surface-2);color:var(--text-2)}
.callout--not-covered{border-inline-start-color:var(--danger-text)}.callout--not-covered .callout__icon{background:var(--danger-soft);color:var(--danger-text)}
.callout--verified{border-inline-start-color:var(--success-text)}.callout--verified .callout__icon{background:var(--success-soft);color:var(--success-text)}
.callout > b{display:block;color:var(--text)}

/* tables (C16) */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-block:var(--s-3) var(--s-4);max-inline-size:100%;border:1px solid var(--border);
  border-radius:var(--r-md)}
.tablewrap:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.tablewrap table{inline-size:100%;min-inline-size:min(560px,100%);font-size:15px}
table th,table td{padding:10px 12px;border-block-end:1px solid var(--border);text-align:start;vertical-align:top;color:var(--text-2)}
table tbody tr:last-child :is(td,th){border-block-end:0}
table thead th{background:var(--surface-1);color:var(--text);font-weight:650;position:sticky;inset-block-start:0}
table tbody th{color:var(--text);font-weight:600}
table.compare{min-inline-size:900px}
table.compare tbody th{position:sticky;inset-inline-start:0;background:var(--bg);min-inline-size:200px;z-index:1}
table.compare thead th:first-child{inset-inline-start:0;z-index:2}
.yes{color:var(--success-text);font-weight:700}.no{color:var(--danger-text)}.part{color:var(--warn-text)}
table.matrix{font-size:13px;min-inline-size:0;inline-size:auto}
table.matrix th,table.matrix td{padding:5px 6px;text-align:center;vertical-align:middle}
table.matrix thead th{position:static;white-space:nowrap}
table.matrix th.vh{writing-mode:vertical-rl;text-align:start;vertical-align:bottom;font-weight:600;max-block-size:12.5em;overflow:hidden;
  text-overflow:ellipsis}
table.matrix tbody th{text-align:start;white-space:nowrap;position:sticky;inset-inline-start:0;background:var(--surface-1);z-index:1}
table.matrix td a{display:inline-flex;align-items:center;justify-content:center;min-inline-size:24px;min-block-size:24px;border-radius:var(--r-xs);
  font-weight:700;text-decoration:none}
table.matrix td a:hover{background:var(--brand-soft)}
table.matrix td.self{background:var(--surface-2)}

/* FAQ (C15) */
.faq{margin-block:var(--s-6)}
.faq__item{border-block-end:1px solid var(--border)}
.faq__item:first-of-type{border-block-start:1px solid var(--border)}
.faq__item > summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  min-block-size:var(--target);padding-block:12px}
.faq__item > summary::-webkit-details-marker{display:none}
.faq__item > summary::after{content:"+";flex:none;font-size:22px;line-height:1;color:var(--text-3);font-weight:400}
.faq__item[open] > summary::after{content:"−"}
.faq__q{font-size:17px;line-height:1.45;margin:0!important;font-weight:650}
.faq__a{padding-block:0 var(--s-4)}
.faq__a p{max-inline-size:var(--reading)}

/* forms (C32) */
.form{display:grid;gap:var(--s-4);max-inline-size:560px;margin-block:var(--s-5)}
.field{display:grid;gap:6px}
.field label,.field-label{font-weight:650;color:var(--text);font-size:15px}
.req{font-weight:400;color:var(--text-3);font-size:14px}
.field-input{inline-size:100%;min-block-size:var(--target);padding:10px 13px;border-radius:var(--r-sm);border:1px solid var(--border-strong);
  background:var(--bg);color:var(--text);font-size:16px}
.field-input:focus-visible{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--brand)}
.field-input[aria-invalid="true"]{border-color:var(--danger-text)}
textarea.field-input{min-block-size:120px;resize:vertical}
.hp{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.form__status:empty{display:none}
.form__status{font-weight:600}
.form__status.is-error{color:var(--danger-text)}
.form__status.is-ok{color:var(--success-text)}

/* code copy (C23) */
.copy-btn{position:absolute;inset-block-start:8px;inset-inline-end:8px;min-block-size:32px;padding:4px 10px;border-radius:var(--r-xs);
  border:1px solid var(--border-strong);background:var(--bg);color:var(--text-2);font-size:13px;font-family:var(--font-sans)}
.copy-btn:hover{color:var(--brand);border-color:var(--brand)}
pre.code{padding-block-start:var(--s-5)}

/* CTA band (C33) */
.cta-band{margin-block:var(--s-7);padding:var(--s-6);border-radius:var(--r-lg);background:var(--brand-soft);border:1px solid var(--border)}
.cta-band h2{margin:0 0 var(--s-2)}

/* 404 */
.notfound{padding-block:var(--s-6)}
.notfound .eyebrow{font-size:15px}

/* toast / live region (C45) */
.toast{position:fixed;inset-block-end:calc(16px + env(safe-area-inset-bottom));inset-inline-start:50%;transform:translateX(-50%);
  z-index:var(--z-toast);background:var(--text);color:var(--bg);padding:10px 16px;border-radius:var(--r-sm);font-size:14.5px;
  box-shadow:var(--shadow-overlay);opacity:0;pointer-events:none;transition:opacity var(--dur-2) var(--ease)}
html[dir="rtl"] .toast{transform:translateX(50%)}
.toast.is-on{opacity:1}
}

/* ========================================================================
   Batch 2: marketing pages (home, platform, apps, pricing, security, demo,
   contact, search). Classes are the contract with scripts/site/components.py;
   data- hooks are the contract with site.js.
   ======================================================================== */
@layer components{
/* layout: full-width bands */
main.page-full{display:block;min-block-size:50vh}
main.page-full + .site-footer{margin-block-start:0}
.band{padding-block:var(--section-pad)}
.band--tight{padding-block:clamp(36px,5vw,64px)}
.band--alt{background:var(--surface-1);border-block:1px solid var(--border)}
.band--brand{background:linear-gradient(180deg,var(--brand-soft),var(--bg) 85%)}
.container--wide{max-inline-size:var(--container-wide)}
.band .section-head{margin-block:0 var(--s-6)}
.section-head--center{text-align:center;margin-inline:auto}
.section-head--center .section-lead{margin-inline:auto}
.prose > :is(p,ul,ol){max-inline-size:var(--reading)}
.prose > * + *{margin-block-start:var(--s-3)}
.prose h2{margin-block:var(--s-6) var(--s-2)}
.prose h3{margin-block:var(--s-5) var(--s-1)}
.prose ul:not([class]){padding-inline-start:1.2em}
.split{display:grid;gap:clamp(28px,4vw,64px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.split--center{align-items:center}
.split--form{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
@media (max-width:959.98px){
  .split,.split--form{grid-template-columns:minmax(0,1fr)}
  .split--form > .split__main{order:-1}
}
.stack > * + *{margin-block-start:var(--s-4)}
.mt-0{margin-block-start:0!important}
.mt-s{margin-block-start:var(--s-4)!important}
.mt-l{margin-block-start:var(--s-6)!important}
.muted{color:var(--text-3)}
.small{font-size:14px}
.ico{inline-size:24px;block-size:24px;flex:none}
.ico--s{inline-size:18px;block-size:18px}
kbd{font-family:var(--font-sans);font-size:12px;line-height:1.4;padding:1px 6px;border:1px solid var(--border);border-block-end-width:2px;
  border-radius:5px;background:var(--surface-1);color:var(--text-2)}
.js-only-block{display:none!important}
html.js .js-only-block{display:block!important}
ul.ticks{list-style:none;display:grid;gap:10px;padding:0}
ul.ticks li{position:relative;padding-inline-start:30px;color:var(--text-2)}
ul.ticks li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.25em;inline-size:20px;block-size:20px;border-radius:50%;
  background:var(--success-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8.5' fill='none' stroke='%2315803d' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
ul.ticks b{color:var(--text)}

/* hero (C08) */
.hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(36px,6vw,88px) clamp(40px,6vw,80px)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(color-mix(in srgb,var(--border) 70%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--border) 70%,transparent) 1px,transparent 1px);
  background-size:44px 44px;-webkit-mask-image:radial-gradient(70% 70% at 70% 20%,#000 20%,transparent 75%);
  mask-image:radial-gradient(70% 70% at 70% 20%,#000 20%,transparent 75%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(55% 60% at 88% 0%,color-mix(in srgb,var(--brand) 16%,transparent),transparent 70%),
    radial-gradient(40% 45% at 0% 100%,color-mix(in srgb,#0bb6cf 12%,transparent),transparent 70%)}
html[dir="rtl"] .hero::before,html[dir="rtl"] .hero::after{transform:scaleX(-1)}
.hero__grid{display:grid;gap:clamp(32px,5vw,64px);align-items:center}
.hero--split .hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)}
.hero__text{min-inline-size:0}
.hero .crumbs{margin-block-end:var(--s-4)}
.hero__eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--brand);background:var(--brand-soft);
  border:1px solid color-mix(in srgb,var(--brand) 25%,transparent);border-radius:var(--r-pill);padding:5px 12px;margin-block-end:var(--s-4)}
.hero h1{max-inline-size:20ch}
.hero--page h1{max-inline-size:24ch}
.hero__lead{font-size:clamp(18px,1.7vw,21px);line-height:1.6;color:var(--text-2);margin-block:var(--s-4) var(--s-5);max-inline-size:56ch}
.hero__actions{margin-block:0 var(--s-5)}
.hero__visual{min-inline-size:0}
@media (max-width:959.98px){.hero--split .hero__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:479.98px){.hero__actions .btn{flex:1 1 100%}}

/* fact chips */
.factchips{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.factchip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--bg) 85%,transparent);font-size:14px;color:var(--text-2)}
.factchip b{color:var(--text);font-weight:750}

/* screenshot frame (C13) */
.shot{margin:0;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1);box-shadow:var(--shadow-overlay);overflow:hidden}
.shot__bar{display:flex;align-items:center;gap:6px;padding:9px 14px;border-block-end:1px solid var(--border);background:var(--surface-2)}
.shot__bar i{inline-size:10px;block-size:10px;border-radius:50%;background:var(--border-strong)}
.shot__url{margin-inline-start:10px;font-size:12.5px;color:var(--text-3);font-family:var(--font-sans)}
.shot img{inline-size:100%;block-size:auto}
.shot__cap{font-size:13px;color:var(--text-3);padding:8px 14px;border-block-start:1px solid var(--border);background:var(--bg)}

/* stat strip (C21) */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;margin:0}
.stat{background:var(--bg);padding:var(--s-5);display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:4px}
.stat__n{font-size:clamp(30px,3.2vw,42px);font-weight:750;color:var(--text);line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat__l{font-size:14.5px;color:var(--text-2);line-height:1.4}
.stats__note{font-size:13px;color:var(--text-3);margin-block-start:var(--s-2)}

/* feature grid (C11) */
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:var(--s-4)}
.fgrid--3{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.feature{position:relative;display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-5);border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--bg)}
.feature > .ico{inline-size:42px;block-size:42px;padding:9px;border-radius:var(--r-sm);background:var(--brand-soft);color:var(--brand)}
.feature__title{font-size:18px;line-height:1.35;margin:var(--s-1) 0 0}
.feature__text{color:var(--text-2);font-size:15.5px;line-height:1.6}
.feature__text p{margin:0 0 6px}
.feature__text .muted{font-size:14px}
.feature__link{margin-block-start:auto;display:inline-flex;align-items:center;gap:6px;font-weight:650;text-decoration:none;min-block-size:var(--target)}
.feature__link:hover{text-decoration:underline}

/* bento (C12) */
.bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-4)}
.bento__cell{grid-column:span 2;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--bg);min-inline-size:0}
.bento__cell--wide{grid-column:span 3}
.bento__cell h3{font-size:clamp(19px,1.8vw,22px);margin:0}
.bento__cell p{margin:0}
.bento__cell .shot{box-shadow:none;margin-block-start:auto}
.applinks{display:flex;flex-wrap:wrap;gap:6px;list-style:none}
.applinks a{display:inline-flex;align-items:center;min-block-size:36px;padding:4px 12px;border:1px solid var(--border);border-radius:var(--r-pill);
  font-size:14px;color:var(--text-2);text-decoration:none;background:var(--surface-1)}
.applinks a:hover{border-color:var(--brand);color:var(--brand)}
.seeall{display:inline-flex;align-items:center;gap:6px;font-weight:650;text-decoration:none;min-block-size:var(--target)}
.seeall:hover{text-decoration:underline}
@media (max-width:959.98px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.bento__cell,.bento__cell--wide{grid-column:span 1}}
@media (max-width:719.98px){.bento{grid-template-columns:minmax(0,1fr)}}

/* status pill */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;line-height:1.4;padding:2px 9px;border-radius:var(--r-pill);
  border:1px solid currentColor;white-space:nowrap}
.pill--ok{color:var(--success-text);background:var(--success-soft)}
.pill--pilot{color:var(--warn-text);background:var(--warn-soft)}
.pill--info{color:var(--brand);background:var(--brand-soft)}
.pill--muted{color:var(--text-2);background:var(--surface-2);border-color:var(--border-strong)}
.pill--warn{color:var(--danger-text);background:var(--danger-soft)}

/* rules we handle (C19) */
.rules{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(176px,100%),1fr));gap:var(--s-2);list-style:none}
.rule{display:flex;flex-direction:column;gap:2px;block-size:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r-md);
  background:var(--bg);text-decoration:none;color:var(--text-2);transition:border-color var(--dur-1) var(--ease)}
.rule:hover{border-color:var(--card-hover-border);color:var(--text-2)}
.rule b{color:var(--text);font-size:16px}
.rule span{font-size:14px;line-height:1.45}
.rule .pill{align-self:flex-start;margin-block-start:6px}

/* tabs (C14): stacked sections without JavaScript */
.tabs__list{display:none}
.tabs__panel + .tabs__panel{margin-block-start:var(--s-6)}
.tabs__heading{font-size:20px;margin:0 0 var(--s-3)}
html.js .tabs.is-ready .tabs__list{display:flex;gap:2px;border-block-end:1px solid var(--border);overflow-x:auto;margin-block-end:var(--s-5);
  scrollbar-width:thin}
html.js .tabs.is-ready .tabs__panel + .tabs__panel{margin-block-start:0}
html.js .tabs.is-ready .tabs__panel[hidden]{display:none}
html.js .tabs.is-ready .tabs__heading{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tabs__tab{flex:none;min-block-size:var(--target);padding:10px 16px;font-weight:650;font-size:15.5px;color:var(--text-2);
  border-block-end:3px solid transparent;margin-block-end:-1px;white-space:nowrap;border-radius:var(--r-xs) var(--r-xs) 0 0}
.tabs__tab:hover{color:var(--text);background:var(--surface-2)}
.tabs__tab[aria-selected="true"]{color:var(--brand);border-block-end-color:var(--brand)}
.tabs__panel:focus-visible{outline:3px solid var(--focus);outline-offset:4px;border-radius:var(--r-sm)}
@media (max-width:719.98px){
  /* phones: the tabs wrap as pills instead of scrolling half off-screen */
  html.js .tabs.is-ready .tabs__list{flex-wrap:wrap;gap:8px;border-block-end:0;overflow:visible}
  .tabs__tab{border:1px solid var(--border-strong);border-radius:var(--r-pill);margin:0;padding:8px 14px;font-size:15px}
  .tabs__tab[aria-selected="true"]{background:var(--brand-soft);border-color:var(--brand)}
}

/* steps (C18) */
.hsteps{list-style:none;display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))}
.hstep{position:relative;padding:var(--s-5);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg)}
.hstep__n{display:inline-flex;align-items:center;justify-content:center;inline-size:36px;block-size:36px;border-radius:50%;background:var(--brand);
  color:var(--on-brand);font-weight:750;margin-block-end:var(--s-3)}
.hstep__title{font-size:18px;margin:0 0 6px}
.hstep__text{color:var(--text-2);font-size:15.5px}
.hstep__text p{margin:0}

/* app tiles (C11) and filter bar (C51) */
.appgroup{margin-block:var(--s-6) 0;scroll-margin-block-start:calc(var(--header-h) + 140px)}
.appgroup[hidden],.apptile[hidden],.empty[hidden]{display:none}
.appgroup__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--s-3);margin-block-end:var(--s-3)}
.appgroup__head h2{font-size:clamp(22px,2.2vw,28px);margin:0}
.appgroup__head p{margin:0;inline-size:100%;color:var(--text-2)}
.count{font-size:14px;color:var(--text-3);font-weight:650}
.appgrid{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:var(--s-3)}
.apptile{position:relative;display:flex;flex-direction:column;gap:6px;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);
  background:var(--bg);transition:border-color var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease)}
.apptile:hover{border-color:var(--card-hover-border);box-shadow:var(--shadow-raised)}
.apptile:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.apptile__name{font-size:16.5px;line-height:1.35;margin:0}
.apptile__link{color:var(--text);text-decoration:none}
.apptile__link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.apptile__link:focus-visible{outline:none;box-shadow:none}
.apptile__text{font-size:14.5px;line-height:1.5;color:var(--text-3);margin:0}
.apptile__meta{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:auto;padding-block-start:4px}
.filterbar{position:sticky;inset-block-start:calc(var(--header-h) - 1px);z-index:5;background:var(--bg);padding-block:var(--s-3);
  border-block-end:1px solid var(--border);margin-block-end:var(--s-2)}
.filterbar__row{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);align-items:center}
.filterbar__q,.sform__box{position:relative;flex:1 1 260px;display:flex;align-items:center;min-inline-size:0}
:is(.filterbar__q,.sform__box) > .ico,:is(.filterbar__q,.sform__box) > .icon{position:absolute;inset-inline-start:13px;color:var(--text-3);pointer-events:none}
:is(.filterbar__q,.sform__box) input{padding-inline-start:42px}
.filterbar__chips{display:flex;gap:8px;overflow-x:auto;padding-block:var(--s-3) 4px;scroll-snap-type:x proximity;scrollbar-width:thin}
.fchip{flex:none;display:inline-flex;align-items:center;gap:7px;min-block-size:40px;padding:6px 14px;border:1px solid var(--border-strong);
  border-radius:var(--r-pill);background:var(--bg);color:var(--text-2);font-size:14.5px;font-weight:600;white-space:nowrap;scroll-snap-align:start;
  text-decoration:none}
.fchip:hover{border-color:var(--brand);color:var(--brand)}
.fchip[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.ftoggle{display:inline-flex;align-items:center;gap:8px;min-block-size:var(--target);font-size:15px;color:var(--text-2);cursor:pointer}
.ftoggle input{inline-size:18px;block-size:18px;accent-color:var(--brand)}
.filterbar__count{font-size:14px;color:var(--text-3);margin-block-start:6px;min-block-size:1.5em}
.chipscroll{display:flex;gap:8px;list-style:none;overflow-x:auto;scroll-snap-type:x proximity;padding-block:4px;scrollbar-width:thin}
.chipscroll li{flex:none;scroll-snap-align:start}
.dot{display:inline-block;inline-size:10px;block-size:10px;border-radius:50%;background:var(--pc,var(--text-3))}

/* empty state (C55) */
.empty{border:1px dashed var(--border-strong);border-radius:var(--r-lg);padding:var(--s-6) var(--s-5);text-align:center;background:var(--surface-1)}
.empty__title{font-size:19px;margin:0 0 6px}
.empty p{margin-inline:auto;max-inline-size:52ch}
.empty .btn-row{justify-content:center}

/* example conversation (C13) */
.chat{margin:0;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1);padding:var(--s-4) var(--s-4) var(--s-5);
  box-shadow:var(--shadow-raised)}
.chat__label{display:inline-flex;font-size:13px;font-weight:700;color:var(--text-2);background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r-pill);padding:2px 10px;margin-block-end:var(--s-4)}
.chat__list{list-style:none;display:grid;gap:var(--s-3)}
.chat__msg{display:grid;gap:4px;max-inline-size:90%}
.chat__msg--user{justify-self:end}
.chat__who{font-size:12.5px;font-weight:700;color:var(--text-3)}
.chat__msg--user .chat__who{text-align:end}
.chat__bubble{padding:10px 14px;border-radius:var(--r-md);font-size:15px;line-height:1.55}
.chat__bubble p{margin:0;color:inherit}
.chat__bubble p + p,.chat__bubble ul{margin-block-start:6px}
.chat__bubble ul{padding-inline-start:1.1em}
.chat__msg--user .chat__bubble{background:var(--brand);color:var(--on-brand);border-end-end-radius:4px}
.chat__msg--ai .chat__bubble{background:var(--bg);border:1px solid var(--border);color:var(--text-2);border-end-start-radius:4px}
.chat__card{display:block;margin-block-start:8px;padding:8px 10px;border-radius:var(--r-sm);background:var(--warn-soft);border:1px solid var(--warn-text);
  color:var(--text);font-size:14px}

/* connection map (C50) */
.cmap{margin:0}
.cmap__filter{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-block-end:var(--s-4)}
.cmap__stage{max-inline-size:780px;margin-inline:auto}
.cmap__svg{inline-size:100%;block-size:auto;overflow:visible}
.cmap__edge{fill:none;stroke:var(--border-strong);opacity:.55;transition:opacity var(--dur-1) var(--ease),stroke var(--dur-1) var(--ease)}
.cmap__node{text-decoration:none}
.cmap__node circle{fill:var(--pc);stroke:var(--bg);stroke-width:2.5}
.cmap__legend{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:6px var(--s-4);margin-block-end:var(--s-3);
  font-size:14px;color:var(--text-2)}
.cmap__legend li{display:inline-flex;align-items:center;gap:7px}
@media (max-width:719.98px){.cmap__legend{display:none}}
.cmap__node text{font-size:15.5px;fill:var(--text-2);font-family:inherit;font-weight:550}
.cmap__node:hover text,.cmap__node:focus text{fill:var(--text);font-weight:750}
.cmap__node:focus{outline:none}
.cmap__node:focus-visible circle{stroke:var(--focus);stroke-width:5}
.cmap__node:focus-visible text{text-decoration:underline}
.cmap__p0{--pc:var(--actor-0)}.cmap__p1{--pc:var(--actor-2)}.cmap__p2{--pc:var(--actor-1)}.cmap__p3{--pc:var(--actor-5)}.cmap__p4{--pc:var(--actor-3)}
.cmap.is-focus .cmap__edge{opacity:.07}
.cmap.is-focus .cmap__edge.is-on{opacity:1;stroke:var(--brand)}
.cmap.is-focus .cmap__node:not(.is-on) text{opacity:.4}
.cmap[data-active] .cmap__node{opacity:.3}
.cmap[data-active] .cmap__edge{opacity:.05}
.cmap[data-active="people"] :is(.cmap__node[data-p="people"],.cmap__edge.pe-people),
.cmap[data-active="finance"] :is(.cmap__node[data-p="finance"],.cmap__edge.pe-finance),
.cmap[data-active="sales"] :is(.cmap__node[data-p="sales"],.cmap__edge.pe-sales),
.cmap[data-active="operations"] :is(.cmap__node[data-p="operations"],.cmap__edge.pe-operations),
.cmap[data-active="data"] :is(.cmap__node[data-p="data"],.cmap__edge.pe-data){opacity:1}
.cmap__hub{text-align:center;margin-block:var(--s-3) 0}
.cmap__hub a{display:inline-flex;align-items:center;gap:6px;font-weight:650;min-block-size:var(--target)}
.cmap__list{margin-block-start:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg)}
.cmap__list > summary{display:flex;align-items:center;min-block-size:48px;padding-inline:var(--s-4);font-weight:650;color:var(--text)}
.cmap__list ul{list-style:none;padding:0 var(--s-4) var(--s-4);display:grid;gap:10px;max-block-size:420px;overflow-y:auto}
.cmap__list li{font-size:14.5px;color:var(--text-2);line-height:1.5}
.cmap__list li > a{font-weight:650}
.cmap__count{color:var(--text-3);font-size:13.5px;margin-inline-start:6px}
.cmap__with{display:block;color:var(--text-3);font-size:13.5px}
@media (max-width:719.98px){.cmap__stage,.cmap__filter{display:none!important}.cmap__list{margin-block-start:0}}

/* sticky CTA (C34): phones only, after the hero */
.sticky-cta{position:fixed;inset-inline:0;inset-block-end:0;z-index:var(--z-sticky);display:flex;align-items:center;gap:var(--s-3);
  padding:10px var(--s-4) calc(10px + env(safe-area-inset-bottom));background:var(--bg);border-block-start:1px solid var(--border);
  box-shadow:0 -6px 24px rgba(10,12,18,.10);transform:translateY(110%);visibility:hidden;
  transition:transform var(--dur-2) var(--ease),visibility 0s linear var(--dur-2)}
.sticky-cta[hidden]{display:none}
.sticky-cta.is-on{transform:none;visibility:visible;transition:transform var(--dur-2) var(--ease)}
.sticky-cta .btn{flex:1 1 auto}
.sticky-cta__text{flex:1 1 50%;font-size:14px;color:var(--text-2);line-height:1.35}
.sticky-cta__text > span{display:block}
@media (max-width:959.98px){html.has-sticky body{padding-block-end:76px}}
@media (min-width:960px){.sticky-cta{display:none!important}}
.sticky-cta__close{flex:none;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--target);
  block-size:var(--target);margin-inline-end:calc(-1 * var(--s-2));border-radius:var(--r-xs);color:var(--text-2)}
.sticky-cta__close:hover{color:var(--text);background:var(--surface-2)}
/* R69: the one reassuring line under a trial button, and a quiet third path under a button row */
.cta-reassure{margin:var(--s-2) 0 0;font-size:14px;color:var(--text-2)}
.cta-alt{margin:var(--s-2) 0 0;font-size:15px}
.btn-row + .cta-reassure{margin-block-start:calc(-1 * var(--s-2))}
.hero__actions + .cta-reassure{margin-block:calc(-1 * var(--s-3)) var(--s-5)}

/* overlays (C42 modal, C43 slide-in, C44/C46 bar, T1 hint): built by overlays.js, rules in ux-research §7.2.
   Fixed and transform-only (no layout shift); anchored to the inline end so RTL mirrors; a sheet on phones. */
.ov{position:fixed;z-index:var(--z-overlay);inset-block-end:calc(16px + env(safe-area-inset-bottom));inset-inline-end:16px;
  inline-size:min(360px,calc(100vw - 32px));margin:0;padding:0;background:var(--bg);color:var(--text);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--shadow-overlay);opacity:0;transform:translateY(12px);
  transition:opacity var(--dur-2) var(--ease),transform var(--dur-2) var(--ease),visibility 0s}
.ov.is-on{opacity:1;transform:none}
.ov.is-tucked{opacity:0;visibility:hidden;pointer-events:none}
.ov__in{position:relative;padding:var(--s-4);padding-inline-end:56px}
.ov__x{position:absolute;inset-block-start:4px;inset-inline-end:4px;display:inline-flex;align-items:center;justify-content:center;
  inline-size:var(--target);block-size:var(--target);border-radius:var(--r-xs);color:var(--text-2)}
.ov__x:hover{background:var(--surface-2);color:var(--text)}
.ov__x svg{inline-size:20px;block-size:20px}
.ov__t{font-size:16.5px;font-weight:700;line-height:1.35;color:var(--text)}
.ov__b{font-size:14.5px;line-height:1.5;color:var(--text-2);margin-block-start:4px;overflow-wrap:anywhere}
.ov__row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3);margin-block-start:var(--s-3)}
.ov__off{min-block-size:var(--target);padding-inline:4px;font-size:14px;color:var(--text-2);text-decoration:underline;text-underline-offset:.18em}
.ov__off:hover{color:var(--text)}
.ov--bar{inline-size:min(440px,calc(100vw - 32px))}
.ov--bar .ov__b{margin:0;color:var(--text)}
.ov--hint{inline-size:auto;max-inline-size:min(360px,calc(100vw - 32px))}
.ov--hint .ov__in{padding-block:var(--s-2);min-block-size:var(--target);display:flex;align-items:center}
dialog.ov--modal{position:fixed;inset:0;margin:auto;block-size:fit-content;inline-size:min(520px,calc(100vw - 32px));
  max-block-size:calc(100dvh - 32px);overflow:auto;transform:scale(.98)}
dialog.ov--modal.is-on{transform:none}
.ov--modal::backdrop{background:rgba(10,12,18,.5)}
.ov--modal .ov__in{padding:var(--s-6) var(--s-5) var(--s-5);padding-inline-end:60px}
.ov--modal .ov__t{font-size:var(--fs-h3)}
.ov--modal .ov__b{font-size:16px}
@media (max-width:719.98px){
  .ov--slidein,.ov--bar{inset-inline:0;inset-block-end:0;inline-size:auto;max-block-size:40vh;overflow:auto;
    border-radius:var(--r-lg) var(--r-lg) 0 0;border-inline:0;border-block-end:0}
  .ov--slidein .ov__in,.ov--bar .ov__in{padding-block-end:calc(var(--s-4) + env(safe-area-inset-bottom))}
}
.drawer__recent{padding:var(--s-1) var(--s-4) 0}
.sr-item__d:empty{display:none}

/* skeleton (C52) */
.skel{display:grid;gap:10px}
.skel__row{display:block;block-size:58px;border-radius:var(--r-md);background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-1) 50%,var(--surface-2) 75%);
  background-size:200% 100%;animation:skel 1.4s ease-in-out infinite}
@keyframes skel{from{background-position:100% 0}to{background-position:-100% 0}}

/* form kit (C32) */
.form--wide{max-inline-size:none}
.form__grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(2,minmax(0,1fr))}
.form__grid > .field--full{grid-column:1/-1}
@media (max-width:719.98px){.form__grid{grid-template-columns:minmax(0,1fr)}}
.field__hint{font-size:14px;color:var(--text-3);line-height:1.45}
.field__error{display:flex;align-items:flex-start;gap:6px;font-size:14px;font-weight:600;color:var(--danger-text);line-height:1.45}
.field__error::before{content:"!";flex:none;display:inline-flex;align-items:center;justify-content:center;inline-size:18px;block-size:18px;
  border-radius:50%;background:var(--danger-text);color:var(--bg);font-size:12px;font-weight:800;margin-block-start:1px}
.field__error[hidden]{display:none}
.field__count{font-size:13px;color:var(--text-3);text-align:end}
.field__count:empty{display:none}
.fieldset{border:0;padding:0;margin:0;min-inline-size:0}
.fieldset > legend{font-weight:650;color:var(--text);font-size:15px;margin-block-end:8px;padding:0}
select.field-input{appearance:auto;padding-inline-end:10px}
.cchips{display:flex;flex-wrap:wrap;gap:8px}
.cchip{position:relative;display:inline-flex}
.cchip input{position:absolute;inset:0;opacity:0;inline-size:100%;block-size:100%;margin:0;cursor:pointer}
.cchip span{display:inline-flex;align-items:center;gap:6px;min-block-size:40px;padding:6px 14px;border:1px solid var(--border-strong);
  border-radius:var(--r-pill);font-size:14.5px;color:var(--text-2);background:var(--bg)}
.cchip input:hover + span{border-color:var(--brand)}
.cchip input:checked + span{background:var(--brand-soft);border-color:var(--brand);color:var(--brand);font-weight:650}
.cchip input:checked + span::before{content:"✓"}
.cchip input:focus-visible + span{outline:3px solid var(--focus);outline-offset:2px}
.rcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:var(--s-2)}
.rcard{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 14px;padding-inline-start:42px;border:1px solid var(--border-strong);
  border-radius:var(--r-md);background:var(--bg);cursor:pointer}
.rcard input{position:absolute;inset-inline-start:14px;inset-block-start:14px;inline-size:18px;block-size:18px;accent-color:var(--brand);margin:0}
.rcard:has(input:checked){border-color:var(--brand);background:var(--brand-soft)}
.rcard:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.rcard__t{font-weight:650;color:var(--text)}
.rcard__x{font-size:14px;color:var(--text-3);line-height:1.45}
.phone{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px}
.phone .field-input{min-inline-size:0}
.form__more{border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.form__more > summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-block-size:52px;padding-inline:var(--s-4);
  font-weight:650;color:var(--text);list-style:none}
.form__more > summary::-webkit-details-marker{display:none}
.form__more > summary::after{content:"+";font-size:22px;font-weight:400;color:var(--text-3)}
.form__more[open] > summary::after{content:"−"}
.form__more > div{display:grid;gap:var(--s-4);padding:0 var(--s-4) var(--s-4)}
.form__summary{border:1px solid var(--danger-text);background:var(--danger-soft);border-radius:var(--r-md);padding:12px 16px}
.form__summary[hidden]{display:none}
.form__summary:focus{outline:3px solid var(--focus);outline-offset:2px}
.form__summary-title{font-weight:700;color:var(--danger-text)!important;margin:0 0 4px}
.form__summary ul{margin:0;padding-inline-start:20px;color:var(--danger-text)}
.form__summary a{color:var(--danger-text);font-weight:600}
.form__privacy{font-size:14px;color:var(--text-3)}
.form__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3)}
.success{border:1px solid var(--success-text);background:var(--success-soft);border-radius:var(--r-lg);padding:var(--s-6)}
.success[hidden]{display:none}
.success__icon{inline-size:44px;block-size:44px;border-radius:50%;background:var(--success-text);color:var(--bg);display:flex;align-items:center;
  justify-content:center;font-size:22px;font-weight:800;margin-block-end:var(--s-3)}
.success__title{font-size:clamp(22px,2.4vw,28px);margin:0 0 6px}
.success__title:focus{outline:none}
.success__ref{font-weight:700;color:var(--text)}
.success__ref:empty{display:none}
.success p{margin-block:6px}
/* demo success: the 30-day trial offer (signup-funnel S2) */
.trycard{margin-block-start:var(--s-5);padding:var(--s-5);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg);box-shadow:var(--shadow-raised)}
.trycard h3{font-size:20px;margin:0 0 4px}
.trycard .btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-4);margin-block-start:var(--s-3)}
.panel{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg);padding:clamp(20px,3vw,32px);box-shadow:var(--shadow-raised)}
.panel--flat{box-shadow:none;background:var(--surface-1)}

/* routes list (contact) */
.routes{list-style:none;display:grid;gap:var(--s-2)}
.route{position:relative;display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg)}
.route:hover{border-color:var(--card-hover-border)}
.route > .ico{inline-size:40px;block-size:40px;padding:8px;border-radius:var(--r-sm);background:var(--brand-soft);color:var(--brand)}
.route h3{font-size:17px;margin:0 0 2px}
.route p{margin:0;font-size:15px}
.route a.route__link{color:var(--text);text-decoration:none}
.route a.route__link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.route:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.route a.route__link:focus-visible{outline:none;box-shadow:none}

/* quote builder (C37) */
.quote{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,330px);gap:var(--s-6);align-items:start}
.quote__group{border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-4);margin:0 0 var(--s-3);background:var(--bg);min-inline-size:0}
.quote__group > legend{font-weight:700;color:var(--text);padding-inline:6px;font-size:16px}
.quote__group > p{font-size:14.5px;margin:0 0 var(--s-2)}
.checkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(210px,100%),1fr));gap:4px}
.check{display:flex;align-items:flex-start;gap:10px;min-block-size:var(--target);padding:9px 10px;border-radius:var(--r-sm);cursor:pointer;
  color:var(--text-2);font-size:15px;line-height:1.4}
.check:hover{background:var(--surface-2)}
.check input{inline-size:18px;block-size:18px;margin:2px 0 0;accent-color:var(--brand);flex:none}
.check:has(input:checked){background:var(--brand-soft);color:var(--text)}
.check:has(input:disabled){cursor:default}
.quote__summary{position:sticky;inset-block-start:calc(var(--header-h) + 16px);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:var(--s-5);background:var(--surface-1);box-shadow:var(--shadow-raised)}
.quote__summary h2{font-size:20px;margin:0 0 var(--s-2)}
.quote__count{font-size:15px;color:var(--text-2);margin:0 0 var(--s-2)}
.quote__count b{font-size:30px;color:var(--text);display:block;line-height:1.15}
.quote__picks{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-block:var(--s-2) var(--s-3);max-block-size:180px;overflow-y:auto}
.quote__picks li{font-size:13px;padding:2px 9px;border-radius:var(--r-pill);background:var(--bg);border:1px solid var(--border);color:var(--text-2)}
.quote__summary .btn{inline-size:100%}
@media (max-width:959.98px){
  .quote{grid-template-columns:minmax(0,1fr)}
  .quote__summary{position:sticky;inset-block-start:auto;inset-block-end:0;z-index:6;border-end-start-radius:0;border-end-end-radius:0;padding:var(--s-3) var(--s-4);
    display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--s-2) var(--s-3)}
  .quote__summary h2,.quote__picks,.quote__note{display:none}
  .quote__count{margin:0}.quote__count b{font-size:22px;display:inline;margin-inline-end:6px}
  .quote__summary .btn{inline-size:auto}
}

/* search: header trigger, palette (C38), results page */
.hsearch{display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding:6px 10px;border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--text-3);text-decoration:none;font-size:14.5px;background:var(--surface-1);white-space:nowrap}
.hsearch:hover{border-color:var(--border-strong);color:var(--text);text-decoration:none}
.hsearch .icon{inline-size:18px;block-size:18px}
.hsearch__kbd{font-size:11.5px}
@media (max-width:1319.98px){
  .hsearch{position:relative;border-color:transparent;background:none;min-inline-size:var(--target);min-block-size:var(--target);
    justify-content:center;padding:8px}
  .hsearch__kbd{display:none}
  /* the label stays as the link's accessible name */
  .hsearch__label{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
.msearch{display:none;align-items:center;justify-content:center;inline-size:var(--target);block-size:var(--target);border-radius:var(--r-xs);color:var(--text)}
.msearch .icon{inline-size:22px;block-size:22px}
.msearch:hover{background:var(--surface-2)}
@media (max-width:959.98px){.msearch{display:inline-flex;margin-inline-start:auto}.msearch ~ .burger{margin-inline-start:0}}
.palette{margin:min(12vh,96px) auto auto;inline-size:min(660px,calc(100vw - 32px));max-inline-size:none;max-block-size:min(72vh,600px);padding:0;
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--bg);color:var(--text);box-shadow:var(--shadow-overlay);overflow:hidden}
.palette[open]{display:flex;flex-direction:column}
.palette::backdrop{background:rgba(10,12,18,.5)}
.palette__form{display:flex;align-items:center;gap:10px;padding-block:8px;padding-inline:16px 8px;border-block-end:1px solid var(--border)}
.palette__form:focus-within{box-shadow:inset 0 -2px 0 var(--focus)}
.palette__form > .icon{inline-size:20px;block-size:20px;color:var(--text-3)}
.palette__input{flex:1 1 auto;min-inline-size:0;min-block-size:48px;border:0;background:none;font-size:18px;color:var(--text)}
.palette__input:focus,.palette__input:focus-visible{outline:none;box-shadow:none}
.palette__input::-webkit-search-cancel-button{display:none}
.palette__close{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--target);block-size:var(--target);border-radius:var(--r-xs);color:var(--text-2)}
.palette__close:hover{background:var(--surface-2)}
.palette__results{list-style:none;overflow-y:auto;padding:6px;flex:1 1 auto}
.palette__results:empty{display:none}
.sr-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:10px 12px;border-radius:var(--r-sm);cursor:pointer}
.sr-item[aria-selected="true"],.sr-item:hover{background:var(--brand-soft)}
.sr-item__t{font-weight:650;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-item__g{font-size:12px;font-weight:700;color:var(--text-3);align-self:center}
.sr-item__d{grid-column:1/-1;font-size:13.5px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.palette__status{padding:10px 16px;font-size:14px;color:var(--text-2);margin:0}
.palette__status:empty{display:none}
.palette__foot{display:flex;flex-wrap:wrap;gap:var(--s-4);padding:8px 16px;border-block-start:1px solid var(--border);font-size:12.5px;color:var(--text-3);
  background:var(--surface-1)}
@media (max-width:719.98px){
  .palette{margin:0;inline-size:100vw;max-block-size:100dvh;block-size:100dvh;border-radius:0;border:0}
  .palette__foot{display:none}
}
.sform{display:flex;flex-wrap:wrap;gap:var(--s-2);max-inline-size:680px}
.drawer__search{padding:var(--s-3) var(--s-4) var(--s-1)}
.drawer__search .btn{display:none}
.sresults{display:grid;gap:var(--s-6);margin-block-start:var(--s-5)}
.sresults:empty{display:none}
.sresults__group h2{font-size:20px;margin:0 0 var(--s-2)}
.sresults__group h2 .count{margin-inline-start:6px}
.sresults ol{list-style:none;display:grid;gap:6px}
.sresult a{display:block;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r-md);text-decoration:none;color:var(--text);background:var(--bg)}
.sresult a:hover{border-color:var(--card-hover-border)}
.sresult__t{display:block;font-weight:650}
.sresult__u{display:block;font-size:12.5px;color:var(--text-3)}
.sresult__d{display:block;font-size:14.5px;color:var(--text-2);margin-block-start:2px}
.search-status{font-weight:600;color:var(--text-2);margin-block-start:var(--s-3)}
.search-status:empty{display:none}

/* storage table + misc */
.keyname{font-family:var(--font-mono);font-size:14px}
.callout .btn-row{margin-block:var(--s-2) 0}
.cta-band--compact{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-4);padding:var(--s-5) var(--s-6);margin-block:0}
.cta-band--compact h2{font-size:clamp(20px,2vw,26px);margin:0 0 4px}
.cta-band--compact p{margin:0}
.cta-band--compact .btn-row{margin:0}
.cta-band--compact .cta-reassure{margin:6px 0 0}
.band .cta-band{margin-block:0}
.cta-band{background:linear-gradient(135deg,var(--brand-soft),color-mix(in srgb,var(--brand-soft) 40%,var(--bg)))}
.packs{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:var(--s-2)}
.packs li{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);padding:10px 14px;border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--bg);color:var(--text)}
.packs li b{font-weight:650}
.packs .code{font-family:var(--font-sans);font-size:12.5px;color:var(--text-3);margin-inline-start:6px}
.isolist{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-block:var(--s-3)}
.isolist li{font-size:14px;padding:4px 10px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--bg);color:var(--text-2)}
.disclose{border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg)}
.disclose > summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-block-size:52px;padding-inline:var(--s-4);
  font-weight:650;color:var(--text);list-style:none}
.disclose > summary::-webkit-details-marker{display:none}
.disclose > summary::after{content:"+";font-size:22px;font-weight:400;color:var(--text-3)}
.disclose[open] > summary::after{content:"−"}
.disclose > div{padding:0 var(--s-4) var(--s-4)}
.lastcheck{font-size:13.5px;color:var(--text-3);margin-block-start:var(--s-3)}

/* tables that become cards on phones (C16) */
@media (max-width:719.98px){
  .tablewrap--stack{border:0;overflow:visible}
  .table--stack,.table--stack tbody,.table--stack tr,.table--stack th,.table--stack td{display:block;inline-size:100%;min-inline-size:0}
  .tablewrap--stack table{min-inline-size:0}
  .table--stack thead{display:none}
  .table--stack tr{border:1px solid var(--border);border-radius:var(--r-md);margin-block-end:var(--s-3);overflow:hidden}
  .table--stack tbody th{background:var(--surface-1);position:static}
  .table--stack td{border-block-end:1px solid var(--border)}
  .table--stack td::before{content:attr(data-label);display:block;font-size:12.5px;font-weight:700;color:var(--text-3);margin-block-end:2px}
}

/* home */
.lastcheck--center{text-align:center}
.starthere{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-5)}
.starthere__h{font-size:18px;margin:0;flex:none}
.starthere .chipscroll{flex:1 1 0;min-inline-size:0;-webkit-mask-image:linear-gradient(to var(--fade-end,right),#000 92%,transparent);
  mask-image:linear-gradient(to var(--fade-end,right),#000 92%,transparent)}
html[dir="rtl"] .starthere .chipscroll{--fade-end:left}
@media (max-width:719.98px){.starthere{display:block}.starthere__h{margin-block-end:var(--s-3)}}
.ico--pillar{inline-size:40px;block-size:40px;padding:8px;border-radius:var(--r-sm);background:var(--brand-soft);color:var(--brand)}
ul.ticks--links a{color:var(--text);text-decoration:none;font-weight:550}
ul.ticks--links a:hover{color:var(--brand);text-decoration:underline}
ul.ticks--links li{min-block-size:var(--target);display:flex;align-items:center}
ul.ticks--links li::before{inset-block-start:calc(50% - 10px)}

/* not found */
.nf-code{font-size:15px;font-weight:700;color:var(--brand);letter-spacing:.06em}
.didyoumean:empty{display:none}
}

/* -------------------------------------------------------------- utilities */
@layer utilities{
.visually-hidden{position:absolute!important;inline-size:1px!important;block-size:1px!important;margin:-1px!important;padding:0!important;
  overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;
    scroll-behavior:auto!important}
}
@media print{
  .site-header,.drawer,.site-footer,.docs-side,.docs-mnav,.skip-link{display:none!important}
  .docs-layout{display:block}
  a{color:inherit}
}