/* نسخة «المدار» — الشاشة الثابتة (قرار المالك 2026-10-14: «شاشة ثابتة بلا تمرير» كتصميم المطوّر الأصلي،
   يلغي «المدار ثم تمرير»). منقولة من حزمة المطوّر (Moneef-focused) بتعديلات دنيا:
   * كل وضع العرض مشروط بـ html.pm/body.presentation-mode اللذين يضيفهما focused.js — بلا JS تبقى
     الصفحة عادية قابلة للتمرير (الكتلة الأخيرة «بلا JS»).
   * الشعار .logo (رابط "/" الحقيقي) بدل .presentation-logo.
   طبقة فوق landing2.css؛ تُحمَّل في «/» فقط حين focused=True. */

:root{
  --top-h:62px;
  --rail-w:76px;
  --controls-h:58px;
  --stage-gap:14px;
  --ease-premium:cubic-bezier(.22,.82,.28,1);
  --ease-soft:cubic-bezier(.2,.65,.3,1);
  --glass:rgba(10,18,32,.76);
  --glass-strong:rgba(12,23,39,.94);
  --hair:rgba(124,161,198,.16);
  --hair-strong:rgba(124,161,198,.28);
  --cyan:#38BDF8;
}

html.pm,body.presentation-mode{width:100%;height:100%;overflow:hidden}
body.presentation-mode{
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;
  background:
    radial-gradient(900px 520px at 12% -15%,rgba(56,189,248,.10),transparent 65%),
    radial-gradient(720px 420px at 88% 108%,rgba(45,212,191,.08),transparent 68%),
    #070c16;
}
body.presentation-mode::before{
  content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent);
}

/* top bar */
.presentation-mode .presentation-top{
  height:var(--top-h);flex:none;position:relative;z-index:70;
  background:rgba(7,12,22,.80);border-bottom:1px solid var(--hair);
  backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%);
}
.presentation-top .wrap{height:100%;max-width:1440px;padding-inline:clamp(14px,3vw,34px);gap:12px}
.presentation-top .logo{min-width:max-content}
.presentation-top .logo i{box-shadow:0 8px 24px -10px rgba(45,212,191,.65)}
.presentation-top .lang{margin-inline-start:auto}
.presentation-download{height:38px;padding:8px 16px!important;border-radius:12px!important}
.route-meta{display:flex;align-items:center;gap:10px;margin-inline-start:6px;min-width:0;color:var(--faint)}
.route-meta b{font-size:13px;color:#cdd9e9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
body.st-launch .route-meta{opacity:0;visibility:hidden}

/* app shell */
.presentation-mode .presentation-app{
  flex:1;min-height:0;position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(780px 500px at 0% 46%,rgba(56,189,248,.095),transparent 68%),
    radial-gradient(520px 360px at 55% 110%,rgba(45,212,191,.055),transparent 72%);
}
.presentation-mode .presentation-app::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;
  background:linear-gradient(120deg,rgba(255,255,255,.018),transparent 27%,transparent 72%,rgba(255,255,255,.012));
}

/* unified route/orbit */
.presentation-mode .arc{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;pointer-events:none;overflow:hidden}
.presentation-mode .arc>*{pointer-events:auto}
.arc-ring{position:absolute;left:0;top:0;width:2000px;height:2000px;overflow:visible;pointer-events:none;will-change:transform;transition:transform .82s var(--ease-premium),opacity .45s var(--ease-soft)}
.arc-ring circle{fill:none;vector-effect:non-scaling-stroke;stroke:rgba(93,126,162,.30);stroke-width:1}
.arc-ring.r2 circle{stroke:rgba(45,212,191,.16);stroke-width:1.25;stroke-dasharray:7 9}
.st-inner .arc-ring.r2{opacity:.55}.st-inner .arc-ring.r1{opacity:.42}

.arc-disc{
  position:absolute;left:0;top:0;border-radius:50%;overflow:hidden;will-change:transform,opacity;
  background:
    radial-gradient(circle at 68% 30%,rgba(56,189,248,.24),transparent 46%),
    radial-gradient(circle at 34% 78%,rgba(45,212,191,.14),transparent 55%),
    linear-gradient(145deg,#10243d 0%,#0a1628 56%,#070e19 100%);
  border:1px solid rgba(108,150,190,.38);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.018),inset -34px -30px 90px rgba(0,0,0,.25),0 30px 90px -45px rgba(56,189,248,.42);
  transition:transform .82s var(--ease-premium),opacity .46s var(--ease-soft),filter .46s;
  transform-origin:center;
}
.arc-disc::before{content:"";position:absolute;top:8%;right:8%;bottom:8%;left:8%;border:1px solid rgba(89,135,175,.18);border-radius:50%;box-shadow:inset 0 0 60px rgba(56,189,248,.035)}
.arc-disc::after{content:"";position:absolute;top:20%;right:20%;bottom:20%;left:20%;border-radius:50%;background:radial-gradient(circle,rgba(45,212,191,.05),transparent 65%)}
.arc-disc>.in{
  position:absolute;top:0;bottom:0;inset-inline-start:47%;inset-inline-end:8%;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;cursor:pointer;
}
.arc-disc .mk{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font:700 15px var(--mono);color:#03201c;background:#63dccb;box-shadow:0 12px 32px -16px rgba(56,189,248,.8);margin-bottom:8px}
.arc-disc strong{font:700 clamp(20px,4.5vw,30px)/1 system-ui,sans-serif;direction:ltr;white-space:nowrap;letter-spacing:-.6px}
.arc-disc strong span{color:#63dccb}.arc-disc small{direction:ltr;color:#a8b7c9;font-size:clamp(9.5px,2vw,12px)}
.arc-disc em{direction:ltr;font:600 clamp(8.5px,1.6vw,10.5px) var(--mono);font-style:normal;color:#55d8cc;margin-top:7px}
.anchor-right .arc-disc>.in{left:7%;right:50%}
.anchor-left .arc-disc>.in{left:50%;right:7%}
@media(max-width:899px){.anchor-right .arc-disc>.in{left:5%;right:47%}.anchor-left .arc-disc>.in{left:47%;right:5%}}
.arc .in{font:inherit;color:inherit;border:0;background:none}
.arc-disc .in:focus-visible{outline-offset:-5px}

.presentation-mode .an{
  position:absolute;left:0;top:0;width:50px;height:50px;border-radius:50%;
  display:grid;place-items:center;color:#cbd8e8;background:rgba(12,24,41,.94);border:1px solid rgba(112,147,184,.44);
  box-shadow:0 10px 34px -24px #000,inset 0 0 0 1px rgba(255,255,255,.012);
  will-change:transform,width,height;
  transition:transform .32s var(--ease-premium),background .18s,border-color .18s;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
.an svg{width:49%;height:49%;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.presentation-mode .an:hover,.presentation-mode .an:focus-visible{border-color:rgba(45,212,191,.72);color:#f6fbff;box-shadow:0 0 0 4px rgba(45,212,191,.07),0 15px 36px -22px rgba(56,189,248,.65)}
.presentation-mode .an.active{color:#03151b;border-color:transparent;background:linear-gradient(135deg,var(--brand),var(--cyan));box-shadow:0 0 0 5px rgba(45,212,191,.10),0 0 28px rgba(56,189,248,.30)}
.presentation-mode .an .al{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;white-space:nowrap;line-height:1.26;pointer-events:none;transition:opacity .28s,transform .32s var(--ease-soft)}
html[dir=ltr] .presentation-mode .an .al{left:calc(100% + 12px);text-align:left}
html[dir=rtl] .presentation-mode .an .al{right:calc(100% + 12px);text-align:right}
.an .al b{font-size:clamp(12.5px,2.7vw,15px);color:#eef5fd}.an .al small{font-size:10.5px;color:#71839e;margin-top:2px}
.st-launch .an .al b{font-size:15px}.st-launch .an .al small{font-size:11px;color:#97aac2}

.launch-copy{position:absolute;top:50%;transform:translateY(-50%);inset-inline-end:clamp(42px,7vw,110px);width:min(430px,34vw);z-index:2;transition:opacity .3s,transform .45s var(--ease-soft)}
.launch-copy p{font-size:18px;line-height:1.9;color:#adbed2;margin:0}
.launch-trust{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.launch-trust span{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--hair);border-radius:999px;background:rgba(13,25,42,.58);padding:7px 10px;font-size:11px;color:#9badc2}
.launch-trust i{width:6px;height:6px;border-radius:50%;background:var(--brand);box-shadow:0 0 10px rgba(45,212,191,.5)}

.arc-actions{position:absolute;z-index:3;display:flex;gap:9px;transition:opacity .3s,transform .45s var(--ease-soft)}
.arc-actions a{height:50px;min-width:150px;border-radius:15px;border:1px solid var(--hair-strong);background:rgba(10,20,35,.82);display:flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:13px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.arc-actions a:hover{border-color:rgba(45,212,191,.55);background:rgba(15,29,48,.94)}
.arc-actions .pri,.presentation-mode .btn.pri{border:0;background:#63dccb;color:#062423;box-shadow:none}
.st-inner .arc-actions,.st-inner .launch-copy{opacity:0;pointer-events:none;transform:translateY(14px)}
@media(min-width:900px){.arc-actions{inset-inline-end:clamp(42px,7vw,110px);bottom:clamp(42px,9vh,86px);width:min(430px,34vw)}}
.st-launch .arc-actions{bottom:40px}
.st-inner .arc-disc{opacity:.08;filter:saturate(.65);pointer-events:none}

/* Fixed-screen layout */
:root{--top-h:64px;--rail-w:100px;--controls-h:58px}
.presentation-top .lang{margin-inline-start:auto;min-width:44px;min-height:44px}
.presentation-top .btn{min-height:44px}
.presentation-mode .presentation-deck{position:absolute;top:0;bottom:0;inset-inline-start:var(--rail-w);inset-inline-end:0;z-index:10}
.st-launch .presentation-deck{visibility:hidden;pointer-events:none}
.presentation-mode .presentation-slide{position:absolute;top:0;right:0;bottom:0;left:0;display:none!important;padding:22px 32px calc(var(--controls-h) + 20px)!important;background:none!important;overflow:hidden}
.presentation-mode .presentation-slide.active{display:block!important}
.presentation-mode .presentation-slide>.wrap{display:flex;flex-direction:column;height:100%;min-height:0;max-width:1160px;padding:0;margin:auto;gap:18px}
.presentation-mode .presentation-slide .sec-head{flex:none;text-align:start;margin:0;max-width:850px}
.presentation-mode .sec-head h2{font-size:clamp(25px,2.5vw,36px);line-height:1.4;margin:8px 0;font-weight:600}
.presentation-mode .sec-head .lead{font-size:16px;line-height:1.7;margin:0;max-width:760px}
.presentation-mode .sec-head .eyebrow{font-size:12px;padding:0;background:none;border:0;color:var(--brand)}
.presentation-mode .reveal,.presentation-mode .reveal:not(.in){opacity:1;transform:none}
.st-inner .arc{width:var(--rail-w);inset-inline-end:auto;overflow:visible}
.st-inner .arc-disc,.st-inner .arc-ring,.st-inner .launch-copy,.st-inner .arc-actions{visibility:hidden}
.presentation-mode.st-inner .an{border-radius:14px;background:transparent;border-color:transparent;box-shadow:none;display:flex;flex-direction:column;justify-content:center;gap:5px}
.presentation-mode.st-inner .an .al{position:static;transform:none;opacity:1;text-align:center;white-space:normal;pointer-events:none}
.st-inner .an .al small{display:none}
.st-inner .an .al b{font-size:12px;font-weight:500;color:#b2c2d6;line-height:1.4}
.st-inner .an svg{width:20px;height:20px;flex:none}
.presentation-mode.st-inner .an.active{background:#10363e;color:#72e9db;border-color:#267c7b}
.st-inner .an.active .al b{color:#cafff7}
.arc-disc,.arc-ring{transition:transform .35s var(--ease-premium),opacity .2s}
.route-meta{display:none}.st-inner .route-meta{display:flex}.route-meta b{font-size:14px;color:#acbfd4}
.slide-controls{display:none}
.presentation-mode .slide-controls{position:absolute;bottom:10px;inset-inline-start:calc(var(--rail-w) + 32px);inset-inline-end:32px;height:46px;display:flex;gap:10px;align-items:center;border-top:1px solid #21344d;padding-top:10px;z-index:40}
.st-launch .slide-controls{visibility:hidden}
.slide-controls button{min-height:44px;padding:7px 16px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;border:1px solid #2c425c;border-radius:10px;background:#0f1d30}
.slide-controls button:disabled{opacity:.35;cursor:default}
.slide-controls .slide-progress{flex:1;min-width:10px;height:3px;background:#1d3048;border-radius:3px;overflow:hidden}
.slide-progress i{display:block;height:100%;background:#63dccb;transition:width .2s}
.route-count{font:11px var(--mono);direction:ltr;color:#9bacc3}
.slide-home{color:#8aeadc}.slide-controls svg{width:16px;height:16px}
.presentation-mode>footer{display:none}
/* قرار المالك 2026-10-14: أزرار واتساب/تيليجرام العائمة ظاهرة في الشاشة الثابتة كما في صفحة الخصوصية، فوق شريط التنقّل السفلي */
.presentation-mode>.float{inset-inline-start:auto;inset-inline-end:14px;bottom:var(--float-bottom,86px);z-index:60}

/* Paged content: all choices stay visible, never a sideways list. */
.focus-stage{flex:1;min-height:0;display:flex;flex-direction:column;gap:14px}
.focus-viewport{flex:1;min-height:0;position:relative;display:flex;flex-direction:column;justify-content:center}
.focus-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:100%;align-items:stretch}
.focus-stage.paged .focus-items{display:block;width:100%;max-width:720px;margin:auto}
.focus-stage.paged .focus-items>[hidden]{display:none!important}
.focus-stage.paged .focus-items>*{width:100%}
.focus-tabs{display:flex;align-items:center;justify-content:center;gap:6px;flex:none;flex-wrap:nowrap}
.focus-tab{width:44px;height:44px;border:1px solid #2c425d;border-radius:10px;font:12px var(--mono);color:#9db1ca}
.focus-tab[aria-pressed=true]{color:#062423;background:#63dccb;border-color:#63dccb}
.focus-controls{display:flex;align-items:center;gap:10px;justify-content:center;flex:none}
.focus-controls>button{min-height:44px;min-width:44px;padding:8px 16px;font-size:14px;border:1px solid #34516e;border-radius:11px;background:#102039}
.focus-controls>button:disabled{opacity:.3}
.focus-count{font:12px var(--mono);direction:ltr;color:#a7bad1;min-width:50px;text-align:center}
.focus-stage:not(.paged) .focus-controls,.focus-stage:not(.paged) .focus-tabs{display:none}
.presentation-mode .card,.presentation-mode .tcard,.presentation-mode .plan,.presentation-mode .how .h{background:#101f32;border-color:#263c56;border-radius:16px;padding:26px}
.presentation-mode .card h3,.presentation-mode .tcard h3{font-size:20px;line-height:1.5}
.presentation-mode .card p,.presentation-mode .tcard p,.presentation-mode .how p{font-size:16px;line-height:1.85;color:#a8bad0}
.presentation-mode .card ul,.presentation-mode .plan ul{font-size:15px;line-height:1.75;color:#c1d0e1}
.presentation-mode .card .ic{margin-bottom:20px}
.presentation-mode .tcard{display:flex;flex-direction:column;gap:16px}
.presentation-mode .tcard .ic{flex:none}
.presentation-mode .plan .p{font-size:40px;margin:14px 0}
.presentation-mode .plan .badge{position:static;align-self:flex-start;margin-bottom:12px;background:#63dccb;color:#062423}
.presentation-mode .plan.best{background:linear-gradient(140deg,#123330,#102235);border-color:#55baa9}
.presentation-mode .plan ul{margin:10px 0 22px}
.presentation-mode .plan .btn{min-height:44px;padding:10px 16px}
.presentation-mode .note{font-size:14px;line-height:1.7;margin:0;text-align:start;color:#a8bad0}
.focus-items details{padding:24px;background:#101f32;border:1px solid #263c56;border-radius:16px}
.focus-items summary{font-size:19px;line-height:1.7;cursor:default;pointer-events:none}
.focus-items summary:after{display:none}
.focus-items details p{font-size:16px;line-height:1.9;padding-top:10px}
.focus-items .h{list-style:none}
.focus-items .h:before{content:attr(data-number);display:block;font:24px var(--mono);color:#63dccb;margin-bottom:18px}

/* Simulator: original scenes, controls and script. Only the surrounding layout changes. */
.presentation-mode #sim .sim{flex:1;min-height:0;display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,1fr);gap:36px;align-items:stretch}
.presentation-mode #sim .sim>div:first-child{display:flex;flex-direction:column;justify-content:center;gap:20px;min-height:0}
.presentation-mode .steps{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;overflow:visible;padding:0}
.presentation-mode .step{display:grid;place-items:center;padding:0;min-width:0;width:100%;height:44px;border:0;border-radius:10px;box-shadow:none!important;background:transparent}
.presentation-mode .step .n{width:34px;height:34px;border-radius:10px;font-size:13px}
.presentation-mode .step .stx{display:none}
.presentation-mode .step.on{background:none}
.presentation-mode .step.on .n{background:#63dccb;color:#062423}
.sim-caption{padding:22px;background:#102039;border:1px solid #263e59;border-radius:16px}
.sim-caption b{display:block;font-size:20px;line-height:1.5;margin-bottom:10px}
.sim-caption #simCap{display:block;text-align:start;margin:0;min-height:0;color:#b2c2d7;font-size:16px;line-height:1.8}
.presentation-mode .simctl{margin:0;gap:12px;font-size:13px}
.presentation-mode .simctl button{min-height:44px;font-size:14px;padding:8px 14px}
.presentation-mode .sim .phonecol{position:relative;min-height:0;overflow:visible}
.presentation-mode .sim .phone{position:absolute;left:50%;top:50%;margin:0;width:300px;max-width:none;height:640px;transform:translate(-50%,-50%) scale(var(--sim-scale,.7));transform-origin:center}
.phone-zoom{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;background:transparent;border:0;cursor:zoom-in;border-radius:20px}
.phone-zoom:focus-visible{outline:2px solid #63dccb;outline-offset:2px}
.phonecol .zoom-hint{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:11px;color:#b8cada;background:#12233a;border:1px solid #2c455f;border-radius:8px;padding:3px 9px;white-space:nowrap;z-index:6;pointer-events:none}
.zoom-close{position:absolute;top:9px;inset-inline-end:14px;min-height:44px;padding:8px 18px;background:#14293c;border:1px solid #34516e;border-radius:10px;z-index:110;font-size:14px}
.sim.zoomed{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100vw!important;height:100dvh!important;background:#070c16;z-index:200!important;display:block!important;overflow:hidden!important}
.sim.zoomed>div:first-child,.sim.zoomed .zoom-hint,.sim.zoomed .phone-zoom{visibility:hidden;display:none!important}
.sim.zoomed .zoom-close{visibility:visible;z-index:210}
.sim.zoomed .phonecol{position:absolute!important;top:58px!important;right:10px!important;bottom:12px!important;left:10px!important;width:auto!important}
.sim.zoomed .phone{position:absolute;left:50%;top:50%;margin:0;width:300px;max-width:none;height:640px;transform:translate(-50%,-50%) scale(var(--sim-scale,.7))}

/* Download and overview keep the exact original copy. */
.presentation-mode #download .dl{flex:1;display:flex;align-items:center;justify-content:center;padding:32px;background:linear-gradient(140deg,#102b33,#0d1a2c);border-color:#254450;border-radius:20px}
.presentation-mode #download .dl>div{width:100%;max-width:700px}
.presentation-mode #download h2{font-size:40px}
.presentation-mode #download .lead{font-size:17px;line-height:1.8}
.presentation-mode #download .cta{margin-top:26px;gap:10px}
.presentation-mode #download .meta{font-size:14px;line-height:1.8;gap:12px;margin-top:22px}
.deck-links{display:flex;justify-content:center;align-items:center;gap:6px 20px;font-size:13px;color:#a6bbd0;flex-wrap:wrap;flex:none}
.deck-links .links{display:flex;gap:4px 20px;flex-wrap:wrap;justify-content:center}
.deck-links a,.deck-links button{display:inline-flex;align-items:center;min-height:44px}
.deck-links .links a[data-i18n=telegram],.deck-links .links a[data-i18n=whatsapp]{display:none}   /* مكرّران في أزرار التحميل أعلاه */
.presentation-mode #download .wrap{gap:10px}
.deck-links .legal-btn{padding:0 12px;border:1px solid #2c425c;border-radius:10px;background:#0f1d30;font-size:13px;color:#cbd8e8}
.presentation-mode .hero>.wrap{display:grid;grid-template-columns:1fr 1fr;align-items:center;height:100%}
.presentation-mode .hero:before{display:none}
.presentation-mode .hero h1{font-size:clamp(28px,3.5vw,44px);overflow-wrap:anywhere}
.presentation-mode .hero .lead{font-size:17px}
.presentation-mode .hero .phonecol{position:relative;height:100%;min-height:0}
.presentation-mode .hero .phone{position:absolute;left:50%;top:50%;width:300px;max-width:none;height:640px;margin:0;transform:translate(-50%,-50%) scale(var(--sim-scale,.75))}
.presentation-mode .trustline{font-size:13px;gap:12px}

/* Reading overlay paginates original content at a comfortable size when space is limited. */
.reader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;background:#091322;padding:18px 22px;display:flex;flex-direction:column;gap:16px}
.reader[hidden]{display:none}
.reader-head{display:flex;align-items:center;justify-content:space-between;gap:14px}
.reader-head strong{font-size:16px;color:#8deadd}
.reader button{min-height:44px;min-width:44px;padding:8px 16px;border:1px solid #33516e;border-radius:10px;background:#13283c;font-size:14px}
.reader-window{flex:1;min-height:0;overflow:hidden;direction:ltr}
.reader-flow{height:100%;column-fill:auto;column-gap:32px;column-width:var(--reader-w);font-size:17px;line-height:1.95;direction:ltr}
.reader-flow>*{direction:rtl}.reader-flow[dir=ltr]>*{direction:ltr}
.reader-flow .card,.reader-flow .plan,.reader-flow .tcard,.reader-flow .dl,.reader-flow .h,.reader-flow details{display:block;border:0;background:none;padding:0;border-radius:0;box-shadow:none}
.reader-flow h2,.reader-flow h3,.reader-flow summary{font-size:24px;line-height:1.6;margin:0 0 18px}
.reader-flow p,.reader-flow li,.reader-flow .lead,.reader-flow .meta,.reader-flow .note{font-size:17px;line-height:1.95;color:#b8c9dc}
.reader-flow ul{margin:18px 0}.reader-flow li{break-inside:avoid}.reader-flow .ic{display:none}.reader-flow .btn{break-inside:avoid}
.reader-controls{display:flex;gap:12px;align-items:center;justify-content:center}
.reader-count{direction:ltr;font:13px var(--mono);color:#a8bed6}
.reader button:disabled{opacity:.35}
.read-more{display:none;min-height:44px;padding:8px 16px;border:1px solid #3a6777;background:#14313c;border-radius:10px;color:#baf4ea;font-size:14px}
.needs-reader .read-more{display:block;flex:none;align-self:stretch}
.needs-reader .focus-items>*:not([hidden]){max-height:100%;overflow:hidden;mask-image:linear-gradient(#000 80%,transparent)}
.needs-reader .focus-viewport{overflow:hidden}
.needs-reader .focus-items{height:100%;overflow:hidden}
.sim-caption .read-more{margin-top:8px}

@media(max-width:899px){
  :root{--top-h:58px;--rail-w:64px;--controls-h:56px}
  .presentation-top .wrap{padding-inline:12px;gap:8px}
  .presentation-top .logo span{font-size:13px}
  .presentation-top .logo i{width:30px;height:32px;font-size:12px}
  .presentation-top .btn{font-size:12px;padding-inline:12px!important}
  .presentation-top .lang{font-size:12px;padding-inline:8px}
  .route-meta{display:none!important}
  .presentation-mode .presentation-slide{padding:16px 16px calc(var(--controls-h) + 14px)!important}
  .presentation-mode .presentation-slide>.wrap{gap:12px}
  .presentation-mode .sec-head h2{font-size:24px;line-height:1.5;margin:5px 0 8px}
  .presentation-mode .sec-head .lead{font-size:14px;line-height:1.75}
  .presentation-mode .sec-head .eyebrow{font-size:11px}
  .focus-stage{gap:10px}
  .focus-items{grid-template-columns:1fr}
  .focus-stage.paged .focus-items{max-width:600px}
  .presentation-mode .card,.presentation-mode .tcard,.presentation-mode .plan{padding:22px}
  .presentation-mode .card h3,.presentation-mode .tcard h3{font-size:19px}
  .presentation-mode .card p,.presentation-mode .tcard p{font-size:15px;line-height:1.85}
  .presentation-mode .card ul,.presentation-mode .plan ul{font-size:14px;line-height:1.75;gap:6px}
  .presentation-mode .card .ic{width:40px;height:40px;margin-bottom:14px}
  .presentation-mode .tcard{gap:12px}
  .presentation-mode .plan h3{font-size:20px}
  .presentation-mode .plan .p{font-size:38px;margin:8px 0}
  .presentation-mode .plan .badge{font-size:11px;margin-bottom:8px}
  .presentation-mode .plan ul{margin-bottom:18px}
  .presentation-mode .plan .btn{font-size:14px}
  .presentation-mode .note{font-size:13px;line-height:1.7}
  .focus-items summary{font-size:18px;line-height:1.7;padding:0}
  .focus-items details p{font-size:15px;line-height:1.85}
  .presentation-mode .slide-controls{inset-inline-start:calc(var(--rail-w) + 16px);inset-inline-end:16px;bottom:10px;gap:6px;height:42px;padding-top:8px}
  .slide-controls button{padding:7px 10px;font-size:12px}
  .slide-home .label{display:none}
  .route-count{display:none}
  .st-inner .an{gap:4px;border-radius:10px}
  .st-inner .an .al b{font-size:10px}
  .st-inner .an svg{width:19px;height:19px}
  .st-launch .launch-copy{display:none}
  .st-launch .arc-actions{bottom:12px;inset-inline-start:12px;inset-inline-end:12px;gap:10px;width:auto}
  .arc-actions a{flex:1;min-width:0;font-size:13px;height:48px}
  .st-launch .an .al b{font-size:14px}
  .st-launch .an .al small{font-size:11px}
  .st-launch .arc-disc strong{font-size:19px}
  .st-launch .arc-disc small{font-size:9px}
  .st-launch .arc-disc em{font-size:8px}
  .st-launch .arc-disc .mk{width:40px;height:40px}
  .st-launch .arc-disc>.in{gap:7px}
  .presentation-mode #sim .sec-head .lead{font-size:13px;line-height:1.6}
  .presentation-mode #sim .sec-head h2{font-size:20px;line-height:1.4;margin:4px 0}
  .presentation-mode #sim .sim{display:flex!important;flex-direction:column;gap:10px}
  /* قرار المالك 2026-10-14: هاتف المحاكي أكبر على الجوال — العنوان مخفي بصرياً (يبقى لقارئ الشاشة) ووصف الخطوة الطويل يُخفى، ويبقى عنوان الخطوة */
  .presentation-mode #sim .sec-head .eyebrow{display:none}
  .presentation-mode #sim .sec-head h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
  .presentation-mode #sim .sim-caption #simCap{display:none}
  .presentation-mode #sim .sim-caption b{margin-bottom:0}
  .presentation-mode #sim .sim>div:first-child{display:contents}
  .presentation-mode .steps{gap:1px;flex:none}
  .presentation-mode .step{height:44px}
  .presentation-mode .step .n{width:28px;height:30px;font-size:12px}
  .sim-caption{padding:12px 14px;border-radius:12px;flex:none}
  .sim-caption b{font-size:15px;line-height:1.5;margin-bottom:4px}
  .sim-caption #simCap{font-size:13px;line-height:1.65}
  .presentation-mode .simctl{order:4;flex:none;justify-content:center;gap:6px;font-size:11px}
  .presentation-mode .simctl button{font-size:12px;padding:6px 9px}
  .presentation-mode .simnote{order:5;flex:none;margin:0;font-size:11px;line-height:1.5}
  .presentation-mode .sim .phonecol{order:3;flex:1;width:100%;min-height:0}
  .sim .phonecol .zoom-hint{bottom:0;font-size:10px}
  .phone-zoom{left:15%;right:15%}
  .presentation-mode #download .dl{padding:24px 20px}
  .presentation-mode #download h2{font-size:32px}
  .presentation-mode #download .lead{font-size:15px;line-height:1.85}
  .presentation-mode #download .cta{margin-top:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .presentation-mode #download .cta .pri{grid-column:1/-1}
  .presentation-mode #download .cta .btn{font-size:13px;padding:10px 6px;min-height:44px}
  .presentation-mode #download .indep{font-size:12px;margin-top:10px}
  .presentation-mode #download h2{margin:8px 0}
  .presentation-mode #download .meta{font-size:12px;line-height:1.9;margin-top:10px;gap:4px 8px}
  .deck-links{font-size:12px}
  .presentation-mode .hero>.wrap{display:flex;flex-direction:column}
  .presentation-mode .hero>.wrap>div:first-child{flex:none}
  .presentation-mode .hero .phonecol{flex:1;min-height:0;width:100%}
  .presentation-mode .hero h1{font-size:27px;margin-top:0}
  .presentation-mode .hero .lead{font-size:14px;line-height:1.8;margin:14px 0}
  .presentation-mode .hero .cta{gap:8px}
  .presentation-mode .hero .btn{padding:10px 12px;font-size:12px}
  .presentation-mode .trustline{font-size:11px;margin-top:12px;gap:6px}
  .presentation-mode .hero .trustline svg{width:14px;height:14px}
}
@media(max-width:370px),(max-height:690px) and (max-width:899px){
  :root{--rail-w:56px;--top-h:54px}
  .presentation-mode .presentation-slide{padding:10px 12px calc(var(--controls-h) + 10px)!important}
  .presentation-mode .presentation-slide>.wrap{gap:10px}
  .presentation-mode .sec-head h2{font-size:20px;margin:3px 0 5px}
  .presentation-mode .sec-head .lead{font-size:13px;line-height:1.65}
  .presentation-mode .card,.presentation-mode .plan,.presentation-mode .tcard{padding:18px}
  .presentation-mode .card h3,.presentation-mode .tcard h3{font-size:17px}
  .presentation-mode .card p,.presentation-mode .tcard p{font-size:14px}
  .presentation-mode .card ul,.presentation-mode .plan ul{font-size:13px}
  .presentation-mode .card .ic{margin-bottom:10px;width:34px;height:34px}
  .presentation-mode .plan .p{font-size:32px;margin:6px 0}
  .presentation-mode .plan ul{margin:6px 0 12px;gap:4px}
  .presentation-mode .plan .btn{padding:8px}
  .focus-stage{gap:8px}
  .presentation-mode .note{font-size:12px}
  .presentation-top .logo span{font-size:12px}
  .presentation-top .btn{font-size:11px;padding-inline:9px!important}
  .st-launch .an .al b{font-size:13px}
  .st-launch .an .al small{font-size:10px}
  .st-launch .arc-disc strong{font-size:16px}
  .st-launch .arc-disc small{font-size:8px}
  .st-launch .arc-disc em{font-size:7px}
  .presentation-mode .slide-controls{inset-inline-start:calc(var(--rail-w) + 12px);inset-inline-end:12px}
  .slide-controls button{font-size:11px;padding-inline:8px}
  .sim-caption{padding:8px 10px}
  .sim-caption b{font-size:14px}
  .sim-caption #simCap{font-size:12px;line-height:1.55}
  .presentation-mode #sim .sec-head h2{font-size:18px}
  .presentation-mode #sim .sec-head .lead{font-size:12px}
  .presentation-mode .step .n{width:24px;height:28px}
  .presentation-mode #download .dl{padding:18px}
  .presentation-mode #download h2{font-size:28px}
}
@media(max-height:500px){
  :root{--top-h:50px;--rail-w:70px}
  .presentation-mode .sec-head .lead{font-size:13px}
  .presentation-mode .sec-head h2{font-size:21px}
  .presentation-mode .presentation-slide{padding:10px 18px 60px!important}
  .focus-stage{gap:6px}
  .sim-caption #simCap{font-size:13px}
  .st-inner .an .al b{font-size:9px}
  .st-inner .an svg{width:15px;height:15px}
  .presentation-mode.st-inner .an{flex-direction:row;gap:5px}
}
[hidden]{display:none!important}

/* One compact card toolbar rather than stacked navigation rows. */
.focus-controls .focus-tabs{flex-wrap:nowrap}
.section-menu,.section-info{display:none}
@media(max-width:899px){
  .focus-controls>.item-prev,.focus-controls>.item-next{font-size:0;width:44px;min-width:44px;padding:0}
  .focus-controls>.item-prev:after,.focus-controls>.item-next:after{content:attr(data-arrow);font-size:18px}
  .focus-controls .focus-count{display:none}
  .focus-controls{gap:6px}
  .focus-controls .focus-tabs{gap:4px}
  .focus-tab{width:36px;min-width:0;height:44px}
  .focus-stage{gap:10px}
}

/* Small/short screens use an all-at-once section chooser, never a sideways menu. */
.compact.st-inner .presentation-deck{inset-inline-start:0}
.compact.st-inner .slide-controls{inset-inline-start:16px}
.compact.st-inner .arc{visibility:hidden;pointer-events:none}
.compact.st-inner .section-menu{display:block;min-height:44px;padding:8px 10px;border:1px solid #31506d;border-radius:10px;color:#bcdded;font-size:12px}
.compact.st-inner .presentation-top .logo span{display:none}
.compact.st-inner .presentation-top .lang{margin-inline-start:auto}
.compact .sec-head{position:relative;padding-top:2px}
.compact .sec-head>.lead{display:none}
.compact .sec-head h2{font-size:21px;line-height:1.4;margin:6px 0;padding-inline-end:84px}
.compact .section-info{display:block;position:absolute;inset-inline-end:0;top:-3px;min-height:44px;padding:4px 10px;color:#a8d7e1;font-size:12px;border:1px solid #2a435d;border-radius:8px}
.compact .note{font-size:11px;line-height:1.5}   /* نصوص قانونية (p_confirm/الإخلاء): تبقى ظاهرة دائماً بخط صغير */
.compact .simnote{font-size:10.5px;line-height:1.45}
.compact .sec-head .eyebrow{font-size:11px;display:block;padding-inline-end:90px;min-height:20px}
.compact.st-inner .presentation-slide{padding:12px 16px 64px!important}
.compact .card,.compact .plan,.compact .tcard{padding:20px}
.compact .card h3,.compact .tcard h3{font-size:18px}
.compact .card p,.compact .tcard p{font-size:15px}
.compact .card ul,.compact .plan ul{font-size:14px}
.compact .sim-caption{padding:10px 14px}
.compact .sim-caption #simCap{font-size:13px}
.compact #sim .sec-head h2{font-size:20px}
.compact #download .dl{padding:20px}
.compact #download .cta{margin-top:14px}
.compact #download .meta{margin-top:14px}
.compact .focus-stage{gap:8px}
.compact .hero>.wrap>div:first-child{max-height:100%;overflow:hidden}
.compact.st-inner.menu-open .arc{visibility:visible;pointer-events:auto;position:fixed;top:calc(var(--top-h) + 10px);left:12px;right:12px;bottom:auto;width:auto;height:auto;z-index:80;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:16px;background:#0c1a2c;border:1px solid #36516c;border-radius:18px;box-shadow:0 0 0 100vmax #030b15c9}
.compact.st-inner.menu-open .an{transform:none!important;position:relative!important;left:auto;top:auto;width:100%!important;height:62px!important;border:1px solid #29455e;border-radius:12px;flex-direction:row;gap:12px;transition:none!important}
.compact.st-inner.menu-open .an .al b{font-size:14px}
.compact.st-inner.menu-open .an svg{width:22px;height:22px}
.compact.st-inner.menu-open .arc>*:not(.an){display:none!important}
.compact.st-inner.menu-open .presentation-deck{pointer-events:none}
.compact .reader .note{display:block}
.compact.menu-open .presentation-top{z-index:90}
@media(max-height:460px){
  .compact.st-inner.menu-open .arc{grid-template-columns:repeat(4,minmax(0,1fr))}
  .compact .focus-controls{min-height:44px}
  .compact .presentation-slide>.wrap{gap:6px}
  .compact #sim .sim{display:grid!important;grid-template-columns:1fr 1fr}
  .compact #sim .sim>div:first-child{display:flex;flex-direction:column;gap:6px}
  .compact #sim .phonecol{min-height:0}
  .compact .simctl{display:none}
  .compact .sim-caption{padding:8px}
  .compact #download .dl{padding:18px}
  .compact #download .dl>div{max-width:none;display:grid;grid-template-columns:1fr 1fr;column-gap:20px}
  .compact #download .dl .eyebrow,.compact #download .dl h2,.compact #download .dl .lead,.compact #download .dl .indep{grid-column:1}
  .compact #download .dl .cta{grid-column:2;grid-row:1/5;margin:0;align-content:center}
  .compact #download .meta{grid-column:1/-1;margin-top:10px}
  .compact #download h2{font-size:26px;margin:0}
  .compact #download .lead{font-size:14px}
  .compact #download .meta{font-size:12px}
}
@media(max-width:370px){
  .st-launch .arc-disc strong{white-space:normal;line-height:1.15}
  .st-launch .arc-disc strong span{display:block}
  .st-launch .arc-disc small{max-width:92px;line-height:1.5}
  .st-launch .arc-disc em{max-width:90px;line-height:1.6;text-align:center}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* ── بلا JS (أو قبل تشغيله): صفحة عادية قابلة للتمرير — المدار قائمة روابط، والأقسام متتالية ── */
html:not(.pm) .arc{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;max-width:1160px;margin:20px auto 0;padding:0 20px}
html:not(.pm) .arc-ring,html:not(.pm) .arc-disc,html:not(.pm) .arc-actions{display:none}
html:not(.pm) .an{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 12px;border:1px solid var(--line2);border-radius:14px;background:var(--surface)}
html:not(.pm) .an svg{width:22px;height:22px;flex:none;color:var(--brand)}
html:not(.pm) .an .al{display:flex;flex-direction:column;line-height:1.3}
html:not(.pm) .an .al b{font-size:14px}
html:not(.pm) .launch-copy{grid-column:1/-1;color:var(--muted)}
html:not(.pm) .launch-copy p{font-size:15px}

/* شريحة التحميل على الشاشات القصيرة: محتوانا أطول قليلاً من الحزمة (البريد + الإخلاء + زرّ الإخلاء الكامل) */
.compact #download .dl{padding:14px 16px}
.compact #download h2{font-size:22px;margin:4px 0}
.compact #download .lead{font-size:13px;line-height:1.6}
.compact #download .cta{margin-top:10px}
.compact #download .indep{font-size:11px;line-height:1.6;margin-top:8px}
.compact #download .meta{font-size:11px;line-height:1.6;margin-top:6px}
.compact .deck-links{gap:0 10px;font-size:11px}
.compact .deck-links .links{gap:0 10px}
.compact .deck-links .legal-btn{padding:0 8px;font-size:11px}
/* الباقة على الجوال: زرّ «اطلب الباقة» يبقى ظاهراً (سطر التجديد مذكور في الأسئلة وفي التطبيق) */
@media(max-width:899px){
  .presentation-mode .plan li[data-i18n=p_renew]{display:none}
  .presentation-mode .plan .p{font-size:30px;margin:4px 0}
  .presentation-mode .plan ul{margin:4px 0 12px}
}
/* الباقات معاً للمقارنة على الجوال (قائمة مضغوطة: الاسم والمزايا | السعر، ثم الزرّ)؛ إن لم تتّسع ⇒ التقليب */
@media(max-width:899px){
  #pricing .focus-stage:not(.paged) .focus-items{gap:8px}
  #pricing .focus-stage:not(.paged) .plan{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name price" "list btn";column-gap:10px;row-gap:2px;align-items:center;padding:10px 14px}
  #pricing .focus-stage:not(.paged) .plan.best{grid-template-areas:"badge badge" "name price" "list btn"}
  #pricing .focus-stage:not(.paged) .plan .badge{grid-area:badge;position:static;justify-self:start;margin:0 0 2px;font-size:10.5px;padding:1px 8px}
  #pricing .focus-stage:not(.paged) .plan h3{grid-area:name;font-size:16px}
  #pricing .focus-stage:not(.paged) .plan .p{grid-area:price;margin:0;font-size:22px;white-space:nowrap;text-align:center}
  #pricing .focus-stage:not(.paged) .plan ul{grid-area:list;margin:0;gap:0;font-size:12.5px;line-height:1.6}
  #pricing .focus-stage:not(.paged) .plan .btn{grid-area:btn;margin:0;min-height:44px;padding:6px 12px;font-size:13px}
}
@media(max-height:460px){
  #pricing .focus-stage:not(.paged) .focus-items{grid-template-columns:repeat(3,minmax(0,1fr))}
  #pricing .focus-stage:not(.paged) .plan{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name price" "list list" "btn btn";padding:8px 12px}
  #pricing .focus-stage:not(.paged) .plan ul{font-size:12px;line-height:1.5}
  #pricing .focus-stage:not(.paged) .plan.best{grid-template-areas:"badge badge" "name price" "list list" "btn btn"}
  #pricing .focus-stage:not(.paged) .focus-items{align-items:end}
}
/* بلا JS: نصّ المدار مكرّر في شريحة «الرئيسية» ⇒ يُخفى، والمدار قائمة روابط فوقها */
html:not(.pm) .launch-copy{display:none}
/* صف التقليب الواحد على الشاشات الضيّقة: مع 5 بطاقات فأكثر لا تتّسع الأسهم مع الأرقام ⇒ الأرقام وحدها (اختيار مباشر) */
@media(max-width:480px){
  .focus-stage[data-n="5"] .item-prev,.focus-stage[data-n="5"] .item-next,
  .focus-stage[data-n="6"] .item-prev,.focus-stage[data-n="6"] .item-next,
  .focus-stage[data-n="7"] .item-prev,.focus-stage[data-n="7"] .item-next,
  .focus-stage[data-n="8"] .item-prev,.focus-stage[data-n="8"] .item-next{display:none}
}
