/* NoorAI site stylesheet, shared by the home page, the blog and every article.
   Moved out of index.html when the blog was added; font paths are relative to this file. */
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-300-arabic.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-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, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-300-latin.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:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-400-arabic.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-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, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-400-latin.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:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-500-arabic.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-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, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-500-latin.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:'Inter';font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/inter-var-latin.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:'JetBrains Mono';font-style:normal;font-weight:400;font-display:optional;src:url(../fonts/jetbrains-mono-400-latin.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}
/* Only the letters of the language button's "العربية", so English pages skip the full Arabic font */
@font-face{font-family:'Plex Arabic Label';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-400-label.woff2) format('woff2')}
/* Layout: Stripe-format marketing page, bilingual (Arabic RTL default, English LTR).
   Gradient mesh over the hero, white canvas below, one filled pill CTA per band,
   composited product mockups, cream Arabic interlude, dark security track. */
:root{
  --primary:#00796b;--primary-deep:#00695c;--primary-press:#004d40;--primary-soft:#009688;
  --tag-bg:#d8f0ea;--tag-fg:#005b50;--brand-dark:#0b3b3a;--console:#072627;
  --ink:#0f2a2b;--ink-2:#2a4547;--ink-mute:#55696b;--on-primary:#ffffff;
  --canvas:#ffffff;--canvas-soft:#f3f8f6;--canvas-cream:#fdf3d2;
  --hairline:#dfe9e6;--hairline-input:#a9cfc7;--input-border:#7b9a95;
  --eyebrow-dark:#8bc34a;--code-ok:#5fd4e6;--code-hl:#b5dc85;--code-warn:#fdc010;--error:#b3261e;
  --m1:#fdc010;--m2:#8bc34a;--m3:#43a047;--m4:#009688;--m5:#09bcd3;--m6:#8bc34a;
  --shadow-rgb:0,77,64;
  --on-dark:#ffffff;
  --on-dark-mute:rgba(255,255,255,.74);
  --on-dark-line:rgba(255,255,255,.16);
  --font-en:'Inter','IBM Plex Sans Arabic',system-ui,-apple-system,sans-serif;
  --font-ar:'IBM Plex Sans Arabic','Inter',system-ui,sans-serif;
  --font:var(--font-en);
  --mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Consolas,monospace;
  --shadow-1:0 1px 3px rgba(var(--shadow-rgb),.08);
  --shadow-2:0 8px 24px rgba(var(--shadow-rgb),.10),0 2px 6px rgba(var(--shadow-rgb),.05);
  --r-xs:4px;--r-sm:6px;--r-md:8px;--r-lg:12px;--r-xl:16px;--r-pill:9999px;
  color-scheme:light;
}
html[lang="ar"]{--font:var(--font-ar)}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{background:var(--canvas);color:var(--ink)}
html{scroll-padding-top:88px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font-family:var(--font);font-weight:300;font-size:15px;line-height:1.4;font-feature-settings:"ss01";-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
h1,h2,h3,h4{font-weight:300;text-wrap:balance}
ul,ol{padding:0;list-style:none}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}
main:focus{outline:none}
.tnum{font-feature-settings:"tnum","ss01";font-variant-numeric:tabular-nums}

/* Bilingual: every string ships in both languages; the inactive one is removed from layout and the accessibility tree */
html[lang="ar"] .t[lang="en"],html[lang="en"] .t[lang="ar"]{display:none!important}
html[lang="ar"] .lb-ar,html[lang="en"] .lb-en{display:none!important}
[lang="ar"]{font-family:var(--font-ar);letter-spacing:0}
html[lang="ar"] body{font-weight:400;font-size:16px}
html[lang="ar"] :is(.d-xxl,.d-xl,.d-lg,.d-md,.h-lg,.h-md){line-height:1.3}
html[lang="ar"] :is(.lead,.body-lg,.card p,.points p,.principles p,.case p,.tier ul,.research p,.step p){line-height:1.8}
html[lang="ar"] :is(.d-xxl,.d-xl,.d-lg,.d-md){font-weight:300}
[dir="ltr"] code,code{font-family:var(--mono)}

.wrap{max-width:1200px;margin-inline:auto;padding-inline:24px}
.band{padding-block:96px}
.band-soft{background:var(--canvas-soft)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;inset-inline-start:16px;top:-60px;z-index:50;background:var(--ink);color:var(--canvas);padding:10px 16px;border-radius:var(--r-pill);font-weight:400}
.skip:focus{top:calc(12px + env(safe-area-inset-top,0px));text-decoration:none}

/* Type scale (Stripe hierarchy; Inter 300 for Latin, IBM Plex Sans Arabic for Arabic) */
.d-xxl{font-size:56px;line-height:1.03;letter-spacing:-1.4px}
.d-xl{font-size:48px;line-height:1.15;letter-spacing:-.96px}
.d-lg{font-size:32px;line-height:1.1;letter-spacing:-.64px}
.d-md{font-size:26px;line-height:1.12;letter-spacing:-.26px}
.h-lg{font-size:22px;line-height:1.1;letter-spacing:-.22px}
.h-md{font-size:20px;line-height:1.4;letter-spacing:-.2px}
.body-lg{font-size:16px;line-height:1.5;color:var(--ink-2)}
.lead{font-size:20px;line-height:1.45;letter-spacing:-.2px;color:var(--ink-2);max-width:34em}
.caption{font-size:13px;letter-spacing:-.39px;color:var(--ink-mute);font-weight:400}
.eyebrow{font-size:15px;font-weight:400;color:var(--primary);margin-bottom:12px;display:block}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:10px 18px;border-radius:var(--r-pill);font:inherit;font-size:16px;font-weight:400;line-height:1.1;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background .15s ease}
.btn:hover{text-decoration:none}
.btn-sm{font-size:14px;min-height:36px;padding:8px 16px}
.btn-primary{background:var(--primary);color:var(--on-primary)}
.btn-primary:hover{background:var(--primary-deep)}
.btn-primary:active{background:var(--primary-press)}
.btn-secondary{background:var(--canvas);color:var(--primary);border-color:var(--primary)}
.btn-secondary:hover{background:var(--tag-bg)}
.btn-on-dark{background:var(--on-dark);color:var(--brand-dark)}
.arr{display:inline-block;transition:transform .15s ease}
.btn:hover .arr,.link-arrow:hover .arr{transform:translateX(2px)}
[dir="rtl"] .arr{transform:scaleX(-1)}
[dir="rtl"] .btn:hover .arr,[dir="rtl"] .link-arrow:hover .arr{transform:scaleX(-1) translateX(2px)}
.link-arrow{font-weight:400;display:inline-flex;gap:6px;align-items:center}

.pill-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-pill);background:var(--tag-bg);color:var(--tag-fg);font-size:12px;font-weight:400;letter-spacing:.1px}
html[lang="ar"] .pill-tag{font-size:13px}
.dot{width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block;flex:none}

/* Nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--canvas) 86%,transparent);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid color-mix(in srgb,var(--hairline) 70%,transparent)}
/* Three columns, equal outer ones, so the links sit exactly in the middle whatever the logo and button widths */
.nav .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;padding-block:10px}
.nav .wrap>.logo{justify-self:start}
.nav-right{justify-self:end}
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:500;font-size:17px}
.logo .t[lang="en"]{letter-spacing:.14em}
.logo .t[lang="ar"]{font-size:20px}
.logo:hover{text-decoration:none}
.logo svg{width:26px;height:26px;flex:none}
.nav-links{display:flex;gap:26px}
.nav-links a{color:var(--ink-2);font-weight:400;font-size:15px}
.nav-right{display:flex;align-items:center;gap:10px}
.lang-btn{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 14px;border-radius:var(--r-pill);border:1px solid var(--input-border);background:var(--canvas);color:var(--ink);font:inherit;font-size:14px;font-weight:400;cursor:pointer}
.lang-btn:hover{background:var(--canvas-soft);text-decoration:none}
.lang-btn svg{width:16px;height:16px;flex:none}
.lang-btn .lb-ar{font-family:'Plex Arabic Label',var(--font-ar);font-size:15px}
.lang-btn .lb-en{font-family:var(--font-en)}
.menu-btn{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--r-pill);border:1px solid var(--input-border);background:var(--canvas);color:var(--ink);cursor:pointer}
.menu-btn svg{width:18px;height:18px}
.menu-panel{border-top:1px solid var(--hairline);background:var(--canvas)}
.menu-panel ul{display:grid;padding-block:8px}
.menu-panel a{display:block;padding:12px 0;min-height:44px;color:var(--ink);font-size:17px;font-weight:400;border-bottom:1px solid var(--hairline)}

/* Hero + gradient mesh */
.hero{position:relative;overflow:hidden;padding-block:72px 112px;isolation:isolate}
.mesh{position:absolute;left:0;right:0;top:-260px;height:880px;transform:skewY(-9deg);transform-origin:50% 0;z-index:-1;overflow:hidden;
  background:
   radial-gradient(38% 58% at 8% 38%,var(--m1) 0%,transparent 72%),
   radial-gradient(34% 52% at 32% 22%,var(--m2) 0%,transparent 70%),
   radial-gradient(38% 60% at 58% 42%,var(--m3) 0%,transparent 70%),
   radial-gradient(34% 58% at 80% 26%,var(--m4) 0%,transparent 70%),
   radial-gradient(40% 70% at 100% 62%,var(--m5) 0%,transparent 72%),
   linear-gradient(100deg,var(--m1) 0%,var(--m2) 30%,var(--m3) 55%,var(--m4) 78%,var(--m5) 100%)}
[dir="rtl"] .mesh{transform:scaleX(-1) skewY(-9deg)}
.mesh::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,var(--canvas) 98%)}
/* Veil keeps hero text at 4.5:1 or better over every mesh stop (measured per variant) */
.veil{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--canvas) 48%,transparent) 0%,color-mix(in srgb,var(--canvas) 48%,transparent) 50%,transparent 64%)}
[dir="rtl"] .veil{background:linear-gradient(270deg,color-mix(in srgb,var(--canvas) 48%,transparent) 0%,color-mix(in srgb,var(--canvas) 48%,transparent) 50%,transparent 64%)}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.75}
.blob.b1{width:520px;height:360px;left:30%;top:34%;background:var(--m6);animation:drift1 4.5s cubic-bezier(.2,.7,.2,1) 1 both}
.blob.b2{width:460px;height:320px;left:66%;top:40%;background:var(--m2);opacity:.55;animation:drift2 4.5s cubic-bezier(.2,.7,.2,1) 1 both}
@keyframes drift1{from{transform:translate(-80px,30px) scale(.9)}to{transform:translate(60px,-20px) scale(1.1)}}
@keyframes drift2{from{transform:translate(90px,-20px) scale(1.1)}to{transform:translate(-70px,20px) scale(.95)}}
@media (prefers-reduced-motion:reduce){.blob{animation:none}.arr,.btn{transition:none}}

.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center}
.hero-copy{display:grid;gap:24px;justify-items:start}
.hero-copy .d-xxl{max-width:12em}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.trust{font-size:14px;color:var(--ink-2);font-weight:400}

/* Composited product mockup */
.composite{position:relative;min-height:470px}
.console{background:var(--console);color:#e7eef0;border-radius:var(--r-xl);box-shadow:var(--shadow-2);overflow:hidden}
.console-bar{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:12px;color:rgba(255,255,255,.74);font-family:var(--font-en)}
.console-bar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.18);display:inline-block}
.console-bar span{margin-left:8px}
.console pre{margin:0;padding:16px 18px 20px;font-family:var(--mono);font-size:12.5px;line-height:1.75;white-space:pre-wrap;word-break:break-word}
.console .ok{color:var(--code-ok)}
.console .dim{color:rgba(255,255,255,.68)}
.console .hl{color:var(--code-hl)}
.composite .console{position:absolute;top:0;left:0;width:86%}
.chat{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);box-shadow:var(--shadow-2);padding:18px;display:grid;gap:12px}
.composite .chat{position:absolute;right:0;bottom:0;width:72%}
[dir="rtl"] .composite .console{left:auto;right:0}
[dir="rtl"] .composite .chat{right:auto;left:0}
.chat-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.chat-head b{font-weight:400;font-size:14px}
.bubble{padding:10px 14px;border-radius:14px;font-size:15px;line-height:1.7}
.bubble.q{background:var(--canvas-soft);border:1px solid var(--hairline);justify-self:start}
.bubble.a{background:var(--tag-bg);color:var(--ink);justify-self:end}
[dir="ltr"] .bubble.q{justify-self:end}
[dir="ltr"] .bubble.a{justify-self:start}
.cite{display:inline-block;font-size:11px;padding:1px 7px;border-radius:var(--r-pill);background:var(--canvas);color:var(--tag-fg);border:1px solid var(--input-border);margin-inline-start:4px;vertical-align:2px;font-family:var(--font-en)}
.chat-foot{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--ink-mute);font-weight:400}
html[lang="ar"] .chat-foot{font-size:13px}
.chat-foot>span{display:inline-flex;align-items:center;gap:5px}
.chat-foot .dot{color:var(--primary)}

/* Stats strip */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--hairline);margin-block-end:72px}
.stat{padding-block:28px 0;padding-inline:0 24px;display:grid;gap:6px;align-content:start}
.stat + .stat{padding-inline-start:24px;border-inline-start:1px solid var(--hairline)}
.stat .num{font-size:44px;letter-spacing:-1.2px;line-height:1.1;color:var(--ink)}
.stat p{color:var(--ink-mute);font-size:14px;max-width:17em}

/* Section head */
.sec-head{display:grid;gap:12px;max-width:44em;margin-bottom:48px}
.sec-head .body-lg{max-width:38em}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}

/* Pillar cards */
.cards-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.cards-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.card{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:32px;display:grid;grid-template-rows:auto auto 1fr auto;gap:14px;box-shadow:var(--shadow-1);min-width:0}
.card .mini{background:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--r-md);padding:18px;min-height:156px;display:grid;align-content:center;gap:10px;margin-bottom:6px}
.card p{color:var(--ink-2);font-size:15px;line-height:1.55}
.checks{display:grid;gap:8px}
.checks li{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:400;color:var(--ink-2)}
.checks li::before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--primary);color:var(--on-primary);font-size:11px;flex:none}
.perim{border:1.5px dashed var(--primary);border-radius:var(--r-md);padding:12px;display:grid;gap:8px}
.perim .lbl{font-size:12px;color:var(--tag-fg);font-weight:500}
.perim .row{display:flex;flex-wrap:wrap;gap:6px}
.perim .row span{font-size:12px;font-weight:400;padding:4px 10px;border-radius:var(--r-pill);background:var(--canvas);border:1px solid var(--hairline)}
.blocked{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-mute);font-weight:400}
.blocked b{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--error);color:#fff;font-size:11px;font-weight:500;flex:none}
.blocked s{text-decoration-thickness:1px}
.tok{display:flex;flex-wrap:wrap;gap:6px;direction:rtl}
.tok span{font-family:var(--font-ar);font-size:15px;padding:3px 9px;border-radius:var(--r-xs);background:var(--canvas);border:1px solid var(--hairline-input)}
.tok span:nth-child(odd){background:var(--tag-bg);border-color:transparent;color:var(--tag-fg)}

/* Dark security track */
.dark{background:var(--brand-dark);color:var(--on-dark)}
.dark .eyebrow{color:var(--eyebrow-dark)}
.dark .body-lg{color:var(--on-dark-mute)}
.layers{display:grid;border-top:1px solid var(--on-dark-line)}
.layers li{display:grid;grid-template-columns:44px minmax(0,130px) minmax(0,1fr);gap:16px;padding-block:18px;border-bottom:1px solid var(--on-dark-line);align-items:baseline}
.layers .n{font-family:var(--mono);font-size:12px;color:var(--on-dark-mute)}
.layers b{font-weight:400;font-size:17px}
.layers li>span:last-child{color:var(--on-dark-mute);font-size:14px;line-height:1.6}
.trace{background:var(--console);border-radius:var(--r-xl);box-shadow:0 12px 40px rgba(0,0,0,.25);overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.trace table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px}
.trace td{padding:9px 14px;border-top:1px solid rgba(255,255,255,.06);color:#e7eef0;vertical-align:top}
.trace td:first-child{color:rgba(255,255,255,.68);white-space:nowrap}
.trace .st{color:var(--code-ok);white-space:nowrap;text-align:right}
.trace .st.warn{color:var(--code-warn)}
.gov{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.gov span{font-size:12px;padding:5px 11px;border-radius:var(--r-pill);border:1px solid var(--on-dark-line);color:var(--on-dark-mute);font-weight:400}
html[lang="ar"] .gov span{font-size:13px}

/* Deployment tiers (pricing-card pattern) */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.tier{border:1px solid var(--hairline);border-radius:var(--r-lg);padding:32px;display:grid;grid-template-rows:auto auto 1fr auto;gap:16px;background:var(--canvas);justify-items:start}
.tier .ph{font-size:13px;font-weight:400;color:var(--ink-mute)}
.tier ul{display:grid;gap:10px;font-size:15px;color:var(--ink-2);align-content:start}
.tier li{display:flex;gap:10px}
.tier li::before{content:"";flex:none;width:14px;height:14px;margin-top:4px;border-radius:50%;box-shadow:inset 0 0 0 4px var(--tag-bg),inset 0 0 0 14px var(--primary)}
.tier.featured{background:var(--brand-dark);color:var(--on-dark);border-color:transparent;box-shadow:var(--shadow-2)}
.tier.featured .ph,.tier.featured ul{color:var(--on-dark-mute)}
.tier.featured li::before{box-shadow:inset 0 0 0 4px var(--brand-dark),inset 0 0 0 14px var(--eyebrow-dark)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:40px;border-top:1px solid var(--hairline);padding-top:24px}
.step{display:grid;gap:6px;align-content:start}
.step .k{font-size:13px;color:var(--primary);font-weight:500}
.step b{font-weight:400;font-size:17px}
.step p{font-size:14px;color:var(--ink-2);line-height:1.55}

/* Cream interlude */
.cream{background:var(--canvas-cream);border-radius:var(--r-lg);padding:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px}
.cream .body-lg{margin-top:16px}
.dialects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dialect{background:color-mix(in srgb,var(--canvas) 75%,transparent);border-radius:var(--r-md);padding:16px 18px;display:grid;gap:4px}
.dialect .say{font-family:var(--font-ar);font-size:24px;line-height:1.4;text-align:right;color:var(--ink)}
.dialect .nm{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:var(--ink-mute);font-weight:400}
.points{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent);padding-top:24px}
.points h3{font-size:17px;font-weight:400;margin-bottom:4px}
.points p{color:var(--ink-2);font-size:14px;line-height:1.55}


/* Contact */
.contact{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.mail{display:inline-flex;align-items:center;gap:10px;margin-top:24px;padding:8px 8px 8px 14px;border:1px solid var(--hairline);border-radius:var(--r-md);background:var(--canvas-soft)}
.mail code{font-size:14px;color:var(--ink);user-select:all}
.mail button{font:inherit;font-size:13px;font-weight:400;background:none;border:0;color:var(--primary);cursor:pointer;padding:6px 8px;min-height:32px}
/* Footer */
footer{padding:64px 24px 104px;color:var(--ink-mute);font-size:13px;border-top:1px solid var(--hairline)}
.foot{max-width:1200px;margin-inline:auto;display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:32px}
.foot h2{font-size:13px;font-weight:500;color:var(--ink);margin-bottom:12px;letter-spacing:0}
.foot ul{display:grid;gap:4px}
.foot a{color:var(--ink-mute);display:inline-block;padding-block:4px}
.foot .tag{margin-top:12px;max-width:24em}
.legal{max-width:1200px;margin:48px auto 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--hairline);padding-top:20px}


/* Responsive */
@media (min-width:1024px){.menu-panel{display:none!important}}
@media (max-width:1100px){.nav-links{gap:18px}.nav-links a{font-size:14px}}
@media (max-width:1023px){
  .hero-grid,.split,.contact,.cream{grid-template-columns:minmax(0,1fr)}
  .cards-3,.tiers{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .tiers .tier:last-child,.cards-3 .card:last-child{grid-column:1/-1}
  .d-xxl{font-size:48px;letter-spacing:-1.1px}
  .d-xl{font-size:38px;letter-spacing:-.76px}
  .nav-links{display:none}
  .nav .wrap{display:flex;justify-content:space-between}
  .menu-btn{display:inline-flex}
  .foot{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot>div:first-child{grid-column:1/-1}
  .composite{max-width:620px}
  .veil,[dir="rtl"] .veil{background:color-mix(in srgb,var(--canvas) 64%,transparent)}
}
@media (max-width:767px){
  .wrap{padding-inline:16px}
  .band{padding-block:64px}
  .hero{padding-block:48px 72px}
  .d-xxl{font-size:36px;letter-spacing:-.8px}
  .d-xl{font-size:30px;letter-spacing:-.6px}
  .d-lg{font-size:26px}
  .lead{font-size:17px}
  .btn{min-height:44px}
  .lang-btn{min-height:44px}
  .nav-right .btn-sm{display:none}
  .cards-3,.cards-2,.tiers,.cases,.principles,.points,.dialects,.row2,.steps{grid-template-columns:minmax(0,1fr)}
  .stats{grid-template-columns:1fr 1fr;margin-block-end:40px}
  .stat,.stat + .stat{padding:20px 0;padding-inline-end:12px;border-inline-start:0}
  .stat:nth-child(even){padding-inline-start:16px;border-inline-start:1px solid var(--hairline)}
  .stat:nth-child(n+3){border-top:1px solid var(--hairline)}
  .stat .num{font-size:32px}
  .composite{min-height:0;display:grid;gap:16px}
  .composite .console,.composite .chat{position:static;width:100%}
  .console pre{font-size:11px;padding:14px;line-height:1.7}
  .composite .console{display:none}
  .cream{padding:28px 20px}
  .layers li{grid-template-columns:36px minmax(0,1fr);gap:4px 12px}
  .layers li>span:last-child{grid-column:2}
  .trace thead{display:none}
  .trace tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:10px 14px;border-top:1px solid rgba(255,255,255,.06)}
  .trace td{padding:0;border:0}
  .trace td:nth-child(2){grid-column:1/-1;grid-row:2}
  .foot{grid-template-columns:1fr 1fr}
  footer{padding-inline:16px;padding-top:40px;padding-bottom:88px}
}

/* Launch additions: stacked mobile menu, raster logo, mailto contact card, three-column footer */
.menu-panel ul.wrap{display:grid;grid-template-columns:minmax(0,1fr)}
.logo img{height:42px;width:auto;flex:none}
.nav .logo{gap:12px;font-size:20px}
.nav .logo .t[lang="ar"]{font-size:24px}
@media (max-width:767px){.nav .logo img{height:36px}.nav .logo{font-size:18px}.nav .logo .t[lang="ar"]{font-size:22px}}
.logo .t[lang="en"]{letter-spacing:.02em}
.logo-full img{width:180px;height:auto;display:block}
.contact-card{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:32px;display:grid;gap:18px;box-shadow:var(--shadow-2);justify-items:start}
.contact-card .mail{margin-top:0;max-width:100%}
.contact-card .mail code{font-size:17px}
.contact-card .caption{max-width:30em}
@media (min-width:1024px){.foot{grid-template-columns:1.3fr repeat(6,1fr);gap:20px}}
@media (max-width:767px){.foot{grid-template-columns:1fr 1fr}.contact-card{padding:24px 20px}.contact-card .mail{flex-wrap:wrap}.contact-card .mail code{font-size:15px;overflow-wrap:anywhere}}

/* Blog: post cards (home page and /blog/), then the article pages */
.posts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.post-card{position:relative;display:grid;grid-template-rows:auto 1fr;background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-1);transition:box-shadow .15s ease,transform .15s ease;min-width:0}
.post-card:hover{box-shadow:var(--shadow-2);transform:translateY(-2px)}
.post-card:has(.post-link:focus-visible){outline:2px solid var(--primary);outline-offset:3px}
.cover{aspect-ratio:16/9;max-width:100%;display:grid;place-items:center;overflow:hidden}
.cover svg{width:56px;height:56px}
.cover-1{background:radial-gradient(80% 120% at 85% 0%,var(--primary-soft) 0%,transparent 60%),linear-gradient(135deg,var(--brand-dark),var(--primary))}
.cover-2{background:radial-gradient(70% 110% at 10% 100%,var(--m3) 0%,transparent 60%),linear-gradient(135deg,var(--primary),var(--console))}
.cover-3{background:radial-gradient(80% 120% at 90% 10%,var(--m2) 0%,transparent 55%),linear-gradient(135deg,var(--m4),var(--brand-dark))}
.cover-4{background:radial-gradient(70% 110% at 90% 100%,var(--m5) 0%,transparent 60%),linear-gradient(135deg,var(--brand-dark),var(--console))}
.cover-5{background:radial-gradient(80% 120% at 15% 0%,var(--m3) 0%,transparent 60%),linear-gradient(135deg,var(--primary-deep),var(--brand-dark))}
.cover-6{background:radial-gradient(70% 110% at 85% 90%,var(--m4) 0%,transparent 60%),linear-gradient(135deg,var(--console),var(--primary))}
.cover-7{background:radial-gradient(80% 120% at 10% 90%,var(--m2) 0%,transparent 55%),linear-gradient(135deg,var(--brand-dark),var(--primary-deep))}
.glyph{font-family:var(--font-ar);font-size:88px;line-height:1;color:#fff;font-weight:300}
.post-body{padding:24px 28px 28px;display:grid;gap:12px;align-content:start;grid-template-rows:auto auto 1fr auto}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.post-body h3{line-height:1.3}
html[lang="ar"] .post-body h3{line-height:1.5}
.post-link{color:var(--ink)}
.post-link::after{content:"";position:absolute;inset:0;z-index:1}
.post-link:hover,.post-link:focus-visible{text-decoration:none;outline:none}
.post-card:hover .post-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.post-body p{color:var(--ink-2);font-size:15px;line-height:1.55}
html[lang="ar"] .post-body p{line-height:1.8}
.posts-foot{margin-top:32px}
@media (prefers-reduced-motion:reduce){.post-card{transition:none}.post-card:hover{transform:none}}

.post{max-width:760px;margin-inline:auto;padding:40px 24px 96px}
.post-back{display:inline-flex;align-items:center;gap:6px;font-weight:400;margin-bottom:28px}
.post-cover{height:180px;border-radius:var(--r-xl);display:grid;place-items:center;box-shadow:var(--shadow-1)}
.post-cover svg{width:56px;height:56px}
.post-head{display:grid;gap:16px;padding-block:32px 28px}
.post-head h1{font-size:40px;line-height:1.15;letter-spacing:-.8px}
html[lang="ar"] .post-head h1{line-height:1.45}
.post-content{display:grid;gap:14px}
.post-content>*{max-width:64ch}
.post-content h2{font-size:22px;font-weight:400;letter-spacing:-.22px;margin-top:16px}
.post-content p,.post-content li{font-size:17px;line-height:1.7;color:var(--ink-2)}
html[lang="ar"] :is(.post-content p,.post-content li){font-size:18px;line-height:1.95}
.post-content ul{display:grid;gap:8px;list-style:disc;padding-inline-start:22px}
.post-content ol{display:grid;gap:8px;list-style:decimal;padding-inline-start:22px}
.post-content li::marker{color:var(--primary)}
.post-content b{font-weight:500;color:var(--ink)}
/* Orchestra deployment diagram (products/orchestra): HTML so it reads in both directions and on phones */
.arch{display:grid;gap:12px;margin-block:8px 12px}
.arch-inside{background:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:16px 18px 18px;display:grid;gap:12px}
.arch-label{font-size:12px;font-weight:500;letter-spacing:.4px;text-transform:uppercase;color:var(--primary-deep)}
html[lang="ar"] .arch-label{text-transform:none;letter-spacing:0;font-size:13px}
.arch-grid{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr) 20px minmax(0,1fr);align-items:center;row-gap:6px}
.arch-card{background:var(--canvas);border:1px solid var(--hairline-input);border-radius:var(--r-lg);padding:10px 12px;display:grid;gap:2px;text-align:center;font-size:14px;line-height:1.35;min-height:72px;align-content:center}
.arch-card b{font-weight:600;color:var(--ink)}
.arch-sub{color:var(--ink-mute);font-size:13px}
.arch-model{background:var(--primary);border-color:var(--primary)}
.arch-model b,.arch-model .arch-sub{color:var(--on-primary)}
.arch-log{grid-column:1 / -1;min-height:0}
.arch-arrow{color:var(--ink-mute);text-align:center;font-size:16px;line-height:1}
html[dir="rtl"] .arch-arrow:not(.arch-down){transform:scaleX(-1)}
.arch-outside{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.arch-ext{border-style:dashed;background:var(--canvas)}
.arch figcaption{color:var(--ink-mute);font-size:14px}
@media (max-width:600px){
  .arch-inside{padding:12px}
  .arch-grid{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr)}
  .arch-card{padding:8px 6px;font-size:12.5px;min-height:64px}
  .arch-sub{font-size:12px}
  .arch-arrow{font-size:12px}
  .arch-outside{grid-template-columns:1fr}
}
/* Blog diagrams (.dg): HTML, so they read in Arabic and English and reflow on phones */
.dg{display:grid;gap:12px;margin-block:8px 12px}
.dg figcaption{color:var(--ink-mute);font-size:14px}
.dg-box{background:var(--canvas-soft);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:16px 18px 18px;display:grid;gap:12px;align-content:start;min-width:0}
.dg-label{font-size:12px;font-weight:500;letter-spacing:.4px;text-transform:uppercase;color:var(--primary-deep)}
html[lang="ar"] .dg-label{text-transform:none;letter-spacing:0;font-size:13px}
.dg-label-sub{margin-top:4px;color:var(--ink-mute)}
.dg-card{background:var(--canvas);border:1px solid var(--hairline-input);border-radius:var(--r-lg);padding:10px 12px;display:grid;gap:3px;align-content:center;text-align:center;font-size:14px;line-height:1.35;min-width:0}
.dg-card b{font-weight:600;color:var(--ink)}
.dg-sub,.dg-note{color:var(--ink-mute);font-size:13px}
.dg-hi{background:var(--primary);border-color:var(--primary)}
.dg-hi b,.dg-hi .dg-sub{color:var(--on-primary)}
.dg-ext{border-style:dashed}
.dg-flow{display:flex;align-items:stretch;gap:6px;min-width:0}
.dg-flow>.dg-card,.dg-flow>.dg-edge{flex:1 1 0}
.dg-ar{align-self:center;flex:none;color:var(--ink-mute);font-size:16px;line-height:1}
html[dir="rtl"] .dg-ar{transform:scaleX(-1)}
.dg-edge{border:1.5px dashed var(--primary);border-radius:var(--r-lg);padding:8px;display:grid;min-width:0}
.dg-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dg-band{background:var(--tag-bg);color:var(--tag-fg);border-radius:var(--r-md);padding:8px 12px;font-size:14px;text-align:center}
.dg-num{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--primary);color:var(--on-primary);font-size:13px;font-weight:600;justify-self:center}
.dg-layers{display:grid;gap:6px}
.dg-layer{display:grid;grid-template-columns:28px minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1.4fr);gap:10px;align-items:center;background:var(--canvas);border:1px solid var(--hairline-input);border-radius:var(--r-lg);padding:10px 12px;font-size:14px;line-height:1.35}
.dg-layer b{font-weight:600}
.dg-layer .dg-what{color:var(--ink-2)}
.dg-layer .dg-guard{color:var(--primary-deep)}
.dg-head{background:none;border:0;padding-block:0;font-size:12px;font-weight:500;color:var(--ink-mute)}
.dg-head .dg-what,.dg-head .dg-guard{color:var(--ink-mute)}
.dg-chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dg-chips li{background:var(--canvas);border:1px solid var(--hairline-input);border-radius:var(--r-pill);padding:6px 12px;font-size:13.5px}
.dg-air{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:12px;align-items:center}
.dg-phases{align-items:stretch}
.dg-decide{align-items:stretch}
.dg-outside{display:grid}
.dg-key-onprem{border-top-color:var(--primary)}
.dg-phase{align-content:start;gap:6px}
.dg-phase-hi{border-color:var(--primary);border-width:1.5px}
.dg-steps{font-weight:500;color:var(--primary-deep);font-size:13.5px}
.dg-out{font-size:13px;color:var(--ink-2);border-top:1px solid var(--hairline);padding-top:6px;margin-top:2px}
.dg-steps-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;counter-reset:none}
.dg-steps-grid .dg-card{align-content:start;gap:6px;min-height:92px}
.dg-q{background:var(--canvas-soft)}
.dg-chart{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:4px 8px;align-items:center}
.dg-chart svg{width:100%;height:auto;grid-column:2;direction:ltr}
.dg-axis-y{grid-row:1;writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;color:var(--ink-mute)}
html[dir="rtl"] .dg-axis-y{transform:none}
.dg-axis-x{grid-column:2;font-size:12px;color:var(--ink-mute);text-align:center}
.dg-axis{fill:none;stroke:var(--input-border);stroke-width:1.5}
.dg-zone{fill:var(--tag-bg);opacity:.6}
.dg-line-onprem{fill:none;stroke:var(--primary);stroke-width:3}
.dg-line-cloud{fill:none;stroke:var(--ink-2);stroke-width:3;stroke-dasharray:8 6}
.dg-guide{fill:none;stroke:var(--input-border);stroke-width:1;stroke-dasharray:3 4}
.dg-dot{fill:var(--canvas);stroke:var(--primary-deep);stroke-width:2.5}
.dg-legend{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13.5px;color:var(--ink-2)}
.dg-legend li{display:flex;align-items:center;gap:8px}
.dg-key{display:inline-block;width:22px;height:0;border-top:3px solid var(--primary)}
.dg-key-cloud{border-top:3px dashed var(--ink-2)}
.dg-key-zone{height:12px;border:0;background:var(--tag-bg);border-radius:2px}
.post-content .dg p,.post-content .dg li{font-size:14px;line-height:1.45;color:var(--ink-2)}
html[lang="ar"] .post-content .dg :is(p,li){font-size:14.5px;line-height:1.6}
.post-content .dg :is(ul,ol){list-style:none;padding-inline-start:0}
.post-content .dg b{font-weight:600}
.post-content .dg .dg-label{font-size:12px;color:var(--primary-deep)}
html[lang="ar"] .post-content .dg .dg-label{font-size:13px}
.post-content .dg .dg-label-sub,.post-content .dg .dg-note{color:var(--ink-mute)}
.post-content .dg .dg-note{font-size:13px}
.post-content .dg .dg-band{color:var(--tag-fg)}
.post-content .dg .dg-chips li{font-size:13.5px}
.post-content .dg .dg-legend li{font-size:13.5px}
@media (max-width:600px){
  .dg-box{padding:12px}
  .dg-cols,.dg-air,.dg-steps-grid{grid-template-columns:1fr}
  .dg-flow{flex-direction:column}
  .dg-ar,html[dir="rtl"] .dg-ar{transform:rotate(90deg)}
  .dg-layer{grid-template-columns:24px minmax(0,1fr);row-gap:2px}
  .dg-layer .dg-what,.dg-layer .dg-guard{grid-column:2}
  .dg-head{display:none}
  .dg-steps-grid .dg-card{min-height:0}
}
.post-download{margin-top:28px;padding:16px 20px;border:1px solid var(--hairline);border-radius:var(--r-lg);background:var(--canvas-soft)}
.post-author{margin-top:40px;padding-top:28px;border-top:1px solid var(--hairline);display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:start}
.post-author img{width:72px;height:72px;border-radius:50%;object-fit:cover;background:var(--canvas-soft)}
.post-author>div{display:grid;gap:4px}
.post-author-name{font-size:17px;color:var(--ink);font-weight:500}
.post-author-name a{color:inherit;text-decoration:none}
.post-author p:last-child{color:var(--ink-2);font-size:15px;line-height:1.6;max-width:38em;margin-top:6px}
.post-cta{margin-top:36px;padding:28px;border:1px solid var(--hairline);border-radius:var(--r-lg);background:var(--canvas-soft);display:grid;gap:14px;justify-items:start}
.post-cta p{color:var(--ink-2);font-size:16px;line-height:1.6;max-width:38em}
.post-more{margin-top:48px;padding-top:28px;border-top:1px solid var(--hairline);display:grid;gap:12px;justify-items:start}
.post-more h2{font-size:13px;font-weight:500;color:var(--ink-mute)}
.post-more ul{display:grid;gap:8px}
.post-more li a{font-size:17px;font-weight:400}
@media (max-width:767px){
  .post{padding:24px 16px 40px}
  .post-cover{height:120px}
  .post-head h1{font-size:30px;letter-spacing:-.6px}
  .post-cta{padding:20px}
}

/* FAQ blocks on product and market pages */
.post-content details.faq{border-top:1px solid var(--hairline);padding:12px 0}
.post-content details.faq:last-of-type{border-bottom:1px solid var(--hairline)}
.post-content details.faq summary{cursor:pointer;font-size:17px;font-weight:500;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:16px}
.post-content details.faq summary::-webkit-details-marker{display:none}
.post-content details.faq summary::after{content:"+";color:var(--primary);font-weight:400}
.post-content details.faq[open] summary::after{content:"−"}
.post-content details.faq p{margin-top:8px}
.industries-h{margin:56px 0 20px}
.post-content a,.lead a,.body-lg a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
/* Analytics consent banner (layout, shown by site.js until the visitor chooses) */
.consent{position:fixed;inset-inline:16px;bottom:16px;z-index:60;max-width:560px;margin-inline:auto;background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-md);box-shadow:0 8px 30px rgba(11,59,58,.16);padding:16px 18px;display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center}
.consent a{text-decoration:underline;text-underline-offset:2px}
.consent[hidden]{display:none}
.consent p{margin:0;flex:1 1 260px;font-size:14px;line-height:1.5;color:var(--ink)}
.consent-btns{display:flex;gap:8px;flex-wrap:wrap}

/* The comparison page (/ai-data-rules/): a wider article so the seven-country table fits; phones get one card per country */
.post.post-wide{max-width:1180px}
.post-wide .post-head,.post-wide .post-content>:not(.rules-wrap){max-width:760px}
.post-content>.rules-wrap{max-width:none}
.rules{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.rules th,.rules td{text-align:start;vertical-align:top;padding:12px 10px;border-bottom:1px solid var(--hairline);color:var(--ink-2)}
.rules thead th{font-weight:500;font-size:13.5px;color:var(--ink);background:var(--canvas-soft);border-bottom:2px solid var(--primary)}
.rules tbody th{font-weight:500;width:12%}
.rules tbody th a:first-child{color:var(--ink);display:block}
.rules .rules-market{display:block;margin-top:4px;font-size:13px;font-weight:400;color:var(--primary)}
@media (max-width:900px){
  .rules thead{display:none}
  .rules,.rules tbody,.rules tr,.rules th,.rules td{display:block;width:auto}
  .rules tr{border:1px solid var(--hairline);border-radius:var(--r-lg);padding:6px 16px;margin-bottom:14px}
  .rules tbody th{font-size:17px;padding:10px 0;width:auto}
  .rules td{padding:8px 0}
  .rules tr>:last-child{border-bottom:0}
  html[lang=en] .rules td::before{content:attr(data-label-en)}
  html[lang=ar] .rules td::before{content:attr(data-label-ar)}
  .rules td::before{display:block;font-size:12.5px;font-weight:500;color:var(--primary-deep)}
}

/* Hero v2 (27 Oct 2026): eyebrow, line-per-fragment headline, network card instead of console + chat */
.eyebrow-hero{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:14px;color:var(--ink-2)}
.eyebrow-hero .dot{width:8px;height:8px;border-radius:50%;background:var(--primary);display:inline-block}
.hero-copy .d-xxl .l{display:block}
.hero-copy .d-xxl .l3{color:var(--primary)}
.hero-copy .d-xxl{max-width:none}
.lead-2{font-size:17px;line-height:1.55;color:var(--ink-mute);max-width:34em;margin:0}
.hero{padding-block:64px 88px}
.hero-visual{margin:0;display:grid;gap:14px;justify-items:end}
[dir="rtl"] .hero-visual{justify-items:start}
.netcard{width:min(100%,540px);background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-xl);box-shadow:var(--shadow-2);overflow:hidden}
.netcard-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 18px;background:var(--brand-dark);color:var(--on-dark);font-size:13px}
.netcard-bar .ok{display:inline-flex;align-items:center;gap:7px;color:var(--code-hl)}
.netcard-bar .ok::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.netcard-body{padding:16px 18px;display:grid;gap:12px}
.node{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px dashed var(--hairline-input);border-radius:var(--r-lg);background:var(--canvas-soft)}
.node .chip{font-family:var(--mono);font-size:12px;padding:3px 8px;border-radius:var(--r-sm);background:var(--brand-dark);color:var(--on-dark);flex:none}
.node b{font-weight:400;font-size:14px;display:block}
.node small{display:block;font-size:12px;color:var(--ink-mute);line-height:1.4}
.netcard .chat{box-shadow:none;padding:14px}
.netcard-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--hairline);background:var(--canvas-soft)}
.netcard-facts>div{padding:12px 16px;font-size:12px;color:var(--ink-mute);display:grid;gap:2px;align-content:start}
.netcard-facts>div+div{border-inline-start:1px solid var(--hairline)}
.netcard-facts b{font-weight:400;font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
.outside{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:13px;color:var(--ink-mute);padding:7px 14px;border:1px solid var(--hairline);border-radius:var(--r-pill);background:color-mix(in srgb,var(--canvas) 72%,transparent)}
.outside .x{color:var(--error);font-family:var(--font-en)}
@media (max-width:1023px){.hero-visual{justify-items:start;max-width:620px}[dir="rtl"] .hero-visual{justify-items:start}}
@media (max-width:767px){.hero{padding-block:40px 64px}.netcard-facts>div{padding:10px 12px;font-size:11px}.netcard-facts b{font-size:14px}.outside{font-size:12px}}
.cream-foot{grid-column:1/-1;max-width:none;margin:0;padding-top:8px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}

/* Contact form (27 Oct 2026): inline, posts to the Google Form in the background */
.cform{display:grid;gap:14px;width:100%}
.cform-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cform label{display:grid;gap:6px;font-size:14px;color:var(--ink-2)}
.cform input,.cform textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--canvas);border:1px solid var(--input-border);border-radius:var(--r-md);padding:10px 12px;min-height:44px;width:100%}
.cform textarea{resize:vertical;min-height:112px}
.cform input:focus,.cform textarea:focus{outline:2px solid var(--primary);outline-offset:1px;border-color:var(--primary)}
.cform-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;opacity:0;pointer-events:none}  /* never offset off-screen: in RTL a left:-9999px box becomes scrollable space */
.cform-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cform-status{margin:0;font-size:14px;color:var(--ink-2)}
.cform-status:empty{display:none}
.cform button[disabled]{opacity:.6;cursor:default}
@media (max-width:600px){.cform-row{grid-template-columns:1fr}}

/* Notice bar above the hero, one featured product card, LeadX as a line (27 Oct 2026) */
.notice{background:var(--brand-dark);color:var(--on-dark);font-size:14px}
.notice p{margin:0;padding:10px 0;line-height:1.5}
.notice a{color:var(--code-hl)}
.card-wide{grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);grid-template-rows:auto auto 1fr;gap:10px 36px;align-items:start}
.card-wide .mini{grid-row:1/4;margin:0;align-self:center}
.card-wide h3{margin-top:4px}
.also{margin:28px 0 0;font-size:15px;color:var(--ink-mute);max-width:48em}
@media (max-width:767px){.card-wide{grid-template-columns:minmax(0,1fr);grid-template-rows:auto}.card-wide .mini{grid-row:auto}}
.also a,.notice a{text-decoration:underline;text-underline-offset:2px}