/* =========================================================
   تحدي الـ60 يوم — نظام التصميم
   خط واحد (Alexandria) · لونان: كحلي ليلي + أزرق ملكي
   ========================================================= */

/* ---------- الخط (مستضاف محليًا) ---------- */
@font-face{
  font-family:"Alexandria";
  src:url("fonts/alexandria-arabic-wght-normal.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}
@font-face{
  font-family:"Alexandria";
  src:url("fonts/alexandria-latin-wght-normal.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap;
  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-200B,U+200F-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* ---------- المتغيرات ---------- */
:root{
  --ink:#111827;          /* الكحلي الليلي */
  --ink-2:#18224a;        /* درجة وسطى في التدرج */
  --royal:#3157D5;        /* الأزرق الملكي */
  --royal-d:#2748B8;      /* hover على الخلفيات الفاتحة */
  --royal-l:#6B8BEF;      /* أزرق فاتح للنصوص على الداكن */
  --sky:#C3D1FA;          /* لمسة فاتحة */
  --paper:#F5F7FC;        /* خلفية محايدة باردة */
  --white:#FFFFFF;
  --on-dark:#EEF2FB;
  --on-dark-2:#AEB8D2;
  --text:#111827;
  --text-2:#4D5873;
  --hair:rgba(17,24,39,.10);
  --hair-d:rgba(238,242,251,.14);
  --grad:linear-gradient(135deg,#111827 0%,#1B2A6B 52%,#3157D5 100%);
  --ease:cubic-bezier(.2,.7,.2,1);
  --max:1120px;
  --font:"Alexandria","Segoe UI",Tahoma,system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{
  font-family:var(--font);font-weight:350;font-size:1.0625rem;line-height:1.95;
  color:var(--text);background:var(--white);overflow-x:hidden;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;
}
ul,ol{list-style:none}
[hidden]{display:none!important}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:22px}
:focus-visible{outline:3px solid var(--royal-l);outline-offset:3px;border-radius:8px}
.ic{width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic--lg{width:1em;height:1em;stroke-width:1.9}

/* ---------- الحالات ---------- */
body[data-status="upcoming"] [data-only]:not([data-only~="upcoming"]),
body[data-status="open"] [data-only]:not([data-only~="open"]),
body[data-status="closed"] [data-only]:not([data-only~="closed"]){display:none}

/* ---------- الأزرار ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:56px;padding:12px 30px;border-radius:14px;border:0;cursor:pointer;
  font:inherit;font-weight:600;font-size:1rem;line-height:1.5;text-decoration:none;
  transition:background-color .28s var(--ease),color .28s var(--ease),transform .22s var(--ease),box-shadow .28s var(--ease);
}
.btn .ic{transition:transform .28s var(--ease)}
.btn--light{background:var(--white);color:var(--ink);box-shadow:0 10px 30px -14px rgba(0,0,0,.55)}
.btn--light:hover{background:var(--sky);transform:translateY(-2px);box-shadow:0 16px 34px -14px rgba(0,0,0,.6)}
.btn--light:hover .ic{transform:translateX(-4px)}
.btn:active{transform:translateY(0) scale(.98);transition-duration:.08s}
.btn--lg{min-height:62px;padding-inline:36px;font-size:1.05rem}
.btn.is-disabled{background:rgba(255,255,255,.14);color:var(--on-dark-2);box-shadow:none;cursor:not-allowed}
.btn.is-disabled:hover{transform:none;background:rgba(255,255,255,.14)}
.btn.is-disabled:hover .ic{transform:none}
.cta-block{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.cta-note{font-size:.84rem;color:var(--on-dark-2);line-height:1.7;min-height:1.4em}

/* ---------- الهيدر ---------- */
.site-header{position:absolute;inset:0 0 auto 0;z-index:5;padding:18px 0}
.bar{display:flex;align-items:center;justify-content:space-between;gap:14px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--on-dark);font-weight:600}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--grad);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font-weight:700;font-size:.85rem}
.status-pill{display:inline-flex;align-items:center;gap:9px;font-size:.78rem;font-weight:400;color:var(--on-dark-2);padding:7px 14px;border-radius:99px;background:rgba(238,242,251,.07);line-height:1.5}
.status-pill b{color:var(--on-dark);font-weight:600}
.status-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--royal-l);box-shadow:0 0 0 0 rgba(107,139,239,.6);animation:pulse 2.6s ease-out infinite}

/* ---------- 1) الواجهة الرئيسية ---------- */
.hero{position:relative;background:var(--ink);color:var(--on-dark);padding:104px 0 56px;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-1}
.glow{position:absolute;border-radius:50%;will-change:transform}
.glow-a{width:760px;height:760px;inset-block-start:-260px;inset-inline-start:-180px;background:radial-gradient(closest-side,rgba(49,87,213,.62),transparent);animation:driftA 26s ease-in-out infinite alternate}
.glow-b{width:640px;height:640px;inset-block-end:-300px;inset-inline-end:-160px;background:radial-gradient(closest-side,rgba(49,87,213,.36),transparent);animation:driftB 32s ease-in-out infinite alternate}
.grid-lines{position:absolute;inset:0;
  background-image:linear-gradient(rgba(238,242,251,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(238,242,251,.045) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse at 60% 40%,#000 15%,transparent 72%);mask-image:radial-gradient(ellipse at 60% 40%,#000 15%,transparent 72%)}

.hero-grid{display:grid;gap:34px;align-items:center}
.eyebrow{display:inline-block;font-size:.82rem;font-weight:500;color:var(--sky);letter-spacing:0;margin-bottom:18px;padding-block-end:6px;border-block-end:1px solid var(--hair-d)}
.hero h1{font-size:clamp(2rem,8.2vw,3.7rem);line-height:1.4;font-weight:700;letter-spacing:-.01em;margin-bottom:20px;text-wrap:balance}
.hero h1 .hl{color:var(--royal-l);background:linear-gradient(90deg,#8FA8F5,#C3D1FA);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lead{font-size:clamp(1rem,3.7vw,1.18rem);line-height:2;color:var(--on-dark-2);max-width:34em;margin-bottom:30px}

.hero-visual{display:flex;justify-content:center}
.ring{width:min(100%,330px);height:auto;overflow:visible}
.ring-num{font-family:var(--font);font-size:112px;font-weight:700;fill:#fff;letter-spacing:-.02em}
.ring-unit{font-family:var(--font);font-size:21px;font-weight:400;fill:#C3D1FA}
.ring-ticks,.ring-inner,.comet{transform-box:view-box;transform-origin:200px 200px}
.ring-ticks{animation:spin 160s linear infinite}
.ring-inner{animation:spin 90s linear infinite reverse}
.comet{animation:spin 48s linear infinite}
.arc{stroke-dasharray:0 1000;animation:arcIn 1.5s var(--ease) forwards;animation-delay:calc(.5s + var(--k)*.22s)}

.facts{display:grid;grid-template-columns:1fr 1fr;gap:26px 18px;margin-top:46px;padding-top:28px;border-block-start:1px solid var(--hair-d)}
.facts li{display:flex;flex-direction:column;gap:6px}
.facts strong{display:flex;align-items:center;height:2.6rem;font-size:2.4rem;line-height:1;font-weight:700;color:#fff;letter-spacing:-.02em}
.facts strong .ic{color:var(--royal-l)}
.facts span{font-size:.86rem;line-height:1.7;color:var(--on-dark-2)}

/* دخول الواجهة */
.in-a{animation:rise .95s var(--ease) both;animation-delay:calc(var(--i,0)*120ms + 120ms)}
.in-b{animation:fadeScale 1.2s var(--ease) both;animation-delay:calc(var(--i,0)*120ms + 120ms)}

/* ---------- أقسام عامة ---------- */
.sec{padding:84px 0}
.sec--paper{background:var(--paper)}
.sec--white{background:var(--white)}
.sec--ink{background:var(--ink);color:var(--on-dark)}
.sec-head{margin-bottom:46px;max-width:34em}
.kicker{display:inline-block;font-size:.84rem;font-weight:600;color:var(--royal);margin-bottom:12px}
.kicker--dark,.sec--ink .kicker{color:var(--royal-l)}
h2{font-size:clamp(1.7rem,6vw,2.75rem);line-height:1.45;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
h3{font-size:1.18rem;line-height:1.6;font-weight:600}
.sub{margin-top:16px;color:var(--on-dark-2);font-size:1rem}

/* ظهور عند التمرير */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .85s var(--ease),transform .85s var(--ease);transition-delay:calc(var(--d,0)*110ms)}
.js .rv.in{opacity:1;transform:none}

/* ---------- 2) المشكلة والحل ---------- */
.pains{display:grid;margin-bottom:56px}
.pains li{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:baseline;padding:26px 0;border-block-end:1px solid var(--hair)}
.pains li:first-child{border-block-start:1px solid var(--hair)}
.pn{font-size:clamp(1.9rem,8vw,3rem);font-weight:200;line-height:1;color:var(--royal);font-variant-numeric:tabular-nums;min-width:2.1ch}
.pains p{font-size:clamp(1.12rem,4.4vw,1.55rem);line-height:1.8;font-weight:500;max-width:28em}

.solution{position:relative;display:grid;gap:26px;padding:34px 26px;border-radius:26px;color:var(--on-dark);background:var(--grad);overflow:hidden;isolation:isolate}
.solution::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(500px 280px at 90% 0,rgba(255,255,255,.14),transparent 70%)}
.sol-art{width:100%;max-width:360px;height:auto;overflow:visible}
.sol-art path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.tangle{stroke:rgba(238,242,251,.38);stroke-width:2.5}
.straight{stroke:#fff;stroke-width:4}
.sol-dot{fill:#fff}
.sol-label{font-size:.84rem;font-weight:600;color:var(--sky);margin-bottom:8px}
.sol-text{font-size:clamp(1.15rem,4.4vw,1.55rem);line-height:1.95;font-weight:500;max-width:28em}
.draw{stroke-dasharray:1;stroke-dashoffset:1}
.js .draw{transition:stroke-dashoffset 1.8s var(--ease) .2s}
.js .straight.draw{transition-delay:.9s}
.js .in .draw{stroke-dashoffset:0}
.sol-dot{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;transition:opacity .5s ease 2.4s,transform .5s var(--ease) 2.4s}
.in .sol-dot{opacity:1;transform:none}
.tangle{transition:opacity 1s ease 2.2s}
.in .tangle{opacity:.5}

/* ---------- 3) كيف سنعمل معًا ---------- */
.steps{position:relative;display:grid;gap:44px;padding-inline-start:0}
.step{position:relative;padding-inline-start:84px}
.step::before{content:"";position:absolute;inset-inline-start:27px;inset-block-start:56px;bottom:-44px;width:2px;background:linear-gradient(var(--royal),rgba(49,87,213,.12));transform:scaleY(0);transform-origin:top;transition:transform 1.1s var(--ease) calc(var(--d,0)*220ms + .5s)}
.step.in::before{transform:scaleY(1)}
.step:last-child::before{display:none}
.node{position:absolute;inset-inline-start:0;inset-block-start:0;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;color:#fff;background:var(--grad);box-shadow:0 14px 28px -14px rgba(49,87,213,.7)}
.node .ic{width:1.5em;height:1.5em}
.step h3{font-size:1.3rem;margin-bottom:6px;display:flex;align-items:baseline;gap:12px}
.step h3 small{font-size:.8rem;font-weight:500;color:var(--royal);letter-spacing:.04em}
.step p{color:var(--text-2);max-width:26em}

/* ---------- 4) رحلة الـ60 يومًا ---------- */
.journey{padding-block:96px}
.journey-grid{display:grid;gap:0}
.day-meter{display:none}
.timeline{--p:0;position:relative;display:grid;gap:0;padding-inline-start:44px}
.timeline::before,.timeline::after{content:"";position:absolute;inset-inline-start:7px;inset-block-start:10px;width:2px;border-radius:2px}
.timeline::before{bottom:10px;background:var(--hair-d)}
.timeline::after{height:calc((100% - 20px)*var(--p));background:linear-gradient(var(--royal-l),#C3D1FA);box-shadow:0 0 16px rgba(107,139,239,.55)}
.phase{position:relative;display:grid;gap:10px;padding:0 0 52px;opacity:.42;transition:opacity .6s var(--ease)}
.phase:last-child{padding-bottom:0}
.phase.done,.phase.active{opacity:1}
.pdot{position:absolute;inset-inline-start:-44px;inset-block-start:6px;width:16px;height:16px;border-radius:50%;background:var(--ink);box-shadow:inset 0 0 0 2px rgba(238,242,251,.28);transition:background-color .5s var(--ease),box-shadow .5s var(--ease),transform .5s var(--ease)}
.phase.done .pdot{background:var(--royal-l);box-shadow:inset 0 0 0 2px var(--royal-l)}
.phase.active .pdot{background:#fff;box-shadow:0 0 0 6px rgba(107,139,239,.28);transform:scale(1.15)}
.pdays{display:flex;align-items:baseline;gap:10px;color:var(--sky)}
.pdays b{white-space:nowrap;font-size:clamp(2rem,9vw,3.2rem);font-weight:200;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pdays small{font-size:.8rem;color:var(--on-dark-2)}
.pbody h3{font-size:1.25rem;color:#fff;margin-bottom:6px}
.pbody p{color:var(--on-dark-2);max-width:32em;font-size:.98rem}

/* ---------- 5) لماذا هذه التجربة مختلفة؟ ---------- */
.why-grid{display:grid;gap:56px}
.edges{display:grid}
.edges li{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:24px 0;border-block-end:1px solid var(--hair)}
.edges li:first-child{border-block-start:1px solid var(--hair)}
.ei{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:rgba(49,87,213,.09);color:var(--royal)}
.ei .ic{width:1.45em;height:1.45em}
.edges h3{margin-bottom:2px;font-size:1.22rem}
.edges p{color:var(--text-2);font-size:.98rem}

.founder{padding:30px 26px;border-radius:24px;background:var(--white);box-shadow:0 30px 60px -36px rgba(17,24,39,.35)}
.avatar{width:96px;height:96px;border-radius:26px;overflow:hidden;margin-bottom:18px;background:var(--grad);display:grid;place-items:center;color:var(--sky)}
.avatar picture{display:block;width:100%;height:100%}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.avatar-ph{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.62rem;font-weight:400;text-align:center;line-height:1.4}
.avatar-ph .ic{width:2em;height:2em}
.founder h3{font-size:1.4rem}
.role{color:var(--royal);font-weight:500;font-size:.92rem;margin-bottom:12px}
.bio{color:var(--text-2);font-size:.98rem}
.fstat{margin-top:22px;padding-top:20px;border-block-start:1px solid var(--hair)}
.fstat[hidden]{display:none}
.fstat strong{display:block;font-size:2.2rem;line-height:1.3;font-weight:700;color:var(--royal);letter-spacing:-.01em}
.fstat span{display:block;font-size:.86rem;line-height:1.85;color:var(--text-2)}

/* ---------- 6) المقاعد والانضمام ---------- */
.sec--join{position:relative;background:var(--grad);color:var(--on-dark);padding:96px 0;overflow:hidden;isolation:isolate}
.join-glow{position:absolute;z-index:-1;width:700px;height:700px;inset-block-start:-320px;inset-inline-end:-200px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.16),transparent);animation:driftB 30s ease-in-out infinite alternate;will-change:transform}
.join-grid{display:grid;gap:34px;align-items:center}
.join-num{display:flex;align-items:baseline;gap:14px;color:#fff}
.join-num strong{font-size:clamp(6.5rem,30vw,12rem);line-height:.9;font-weight:200;letter-spacing:-.04em;background:linear-gradient(180deg,#fff 10%,rgba(195,209,250,.55));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.join-num span{font-size:1.1rem;color:var(--sky);font-weight:500}
.join-copy h2{margin-bottom:14px}
.join-why{color:var(--on-dark-2);max-width:30em;margin-bottom:30px;color:#D3DBF1}
.join-meta{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:32px;padding-block:20px;border-block:1px solid rgba(238,242,251,.22)}
.join-meta dt{font-size:.78rem;color:var(--sky);margin-bottom:2px}
.join-meta dd{font-size:1rem;font-weight:600;line-height:1.6}
.join-meta .on{color:#fff}
.join .cta-note,.sec--join .cta-note{color:#C9D3EE}
.fine{margin-top:28px;max-width:34em;font-size:.8rem;line-height:1.9;color:#B8C4E6}


/* ---------- بعد الانضمام ---------- */
.btn--ghost{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(238,242,251,.45)}
.btn--ghost:hover{background:rgba(255,255,255,.2);transform:translateY(-2px);box-shadow:inset 0 0 0 1.5px rgba(238,242,251,.8)}
.btn--ghost.is-disabled{background:rgba(255,255,255,.06);color:var(--on-dark-2);box-shadow:inset 0 0 0 1.5px rgba(238,242,251,.2)}
.after-steps{position:relative;display:grid;gap:40px;margin-bottom:54px}
.astep{position:relative;padding-inline-start:84px}
.astep::before{content:"";position:absolute;inset-inline-start:27px;inset-block-start:60px;bottom:-40px;width:2px;background:linear-gradient(var(--royal),rgba(49,87,213,.12));transform:scaleY(0);transform-origin:top;transition:transform 1.1s var(--ease) calc(var(--d,0)*220ms + .5s)}
.astep.in::before{transform:scaleY(1)}
.astep:last-child::before{display:none}
.anode{position:absolute;inset-inline-start:0;inset-block-start:0;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;color:var(--royal);background:rgba(49,87,213,.09);box-shadow:inset 0 0 0 1.5px rgba(49,87,213,.28)}
.anode .ic{width:1.5em;height:1.5em}
.astep h3{display:flex;align-items:baseline;gap:12px;font-size:1.3rem;margin-bottom:6px}
.astep h3 small{display:inline-grid;place-items:center;width:1.7em;height:1.7em;border-radius:50%;font-size:.8rem;font-weight:600;color:#fff;background:var(--royal);line-height:1}
.astep p{color:var(--text-2);max-width:27em}
.after-call{display:grid;gap:26px;padding:34px 26px;border-radius:26px;color:var(--on-dark);background:var(--grad);position:relative;overflow:hidden;isolation:isolate}
.after-call::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(460px 260px at 90% 0,rgba(255,255,255,.14),transparent 70%)}
.after-copy h3{font-size:clamp(1.3rem,5vw,1.75rem);line-height:1.6;margin-bottom:10px}
.after-copy p{color:#D3DBF1;max-width:32em;font-size:1rem}
.after-action{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.after-action .cta-note{color:#C9D3EE;max-width:24em}
.after-link{display:inline-block;margin-top:2px;font-size:.84rem;color:var(--sky);text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(195,209,250,.45);transition:color .25s var(--ease),text-decoration-color .25s var(--ease)}
.after-link:hover{color:#fff;text-decoration-color:#fff}
@media (max-width:479px){.after-action,.after-action .btn{width:100%}.after-action .btn{padding-inline:14px;font-size:.9rem;gap:9px;white-space:nowrap}}
@media (min-width:640px){.after-call{grid-template-columns:1fr auto;align-items:center;gap:44px;padding:44px 48px}.after-action{align-items:stretch;min-width:300px}.after-action .btn{white-space:nowrap}}
@media (min-width:900px){
  .after-steps{grid-template-columns:repeat(3,1fr);gap:40px;padding-top:34px}
  .after-steps::before{content:"";position:absolute;inset-inline:32px;inset-block-start:30px;height:2px;background:linear-gradient(90deg,var(--royal),rgba(49,87,213,.15));transform:scaleX(0);transform-origin:right;transition:transform 1.4s var(--ease) .3s}
  .after-steps:has(.astep.in)::before{transform:scaleX(1)}
  .astep{padding-inline-start:0;padding-top:50px}
  .astep::before{display:none}
  .anode{inset-block-start:-34px;width:64px;height:64px;border-radius:20px;background:var(--white)}
}

/* ---------- الفوتر والزر الثابت ---------- */
.site-footer{background:var(--ink);color:var(--on-dark-2);text-align:center;font-size:.82rem;padding:30px 0 120px}
.sticky-cta{position:fixed;inset-inline:0;bottom:0;z-index:50;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(17,24,39,0),rgba(17,24,39,.92) 38%);transform:translateY(130%);transition:transform .4s var(--ease);pointer-events:none}
.sticky-cta.show{transform:none;pointer-events:auto}
.sticky-cta .btn{width:100%;min-height:54px;box-shadow:0 12px 32px -10px rgba(0,0,0,.7)}
.sticky-cta .btn.is-disabled{background:#2a3358}

/* ---------- زر واتساب العائم ---------- */
.wa-float{position:fixed;inset-inline-end:16px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--on-dark);transition:bottom .4s var(--ease),transform .25s var(--ease)}
.wa-float-ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 12px 28px -10px rgba(0,0,0,.55),0 0 0 3px rgba(255,255,255,.9);transition:box-shadow .28s var(--ease),transform .25s var(--ease)}
.wa-float-ic svg{width:30px;height:30px;fill:currentColor}
.wa-float-label{display:none;padding:9px 16px;border-radius:99px;background:var(--ink);font-size:.86rem;font-weight:500;line-height:1.5;white-space:nowrap;box-shadow:0 10px 26px -12px rgba(0,0,0,.6),inset 0 0 0 1px var(--hair-d)}
.wa-float:hover{transform:translateY(-2px)}
.wa-float:hover .wa-float-ic{box-shadow:0 16px 32px -10px rgba(0,0,0,.6),0 0 0 3px #fff}
body.has-sticky .wa-float{bottom:calc(92px + env(safe-area-inset-bottom))}
@media (min-width:900px){
  .wa-float{inset-inline-end:26px;bottom:26px}
  .wa-float-label{display:block}
}

/* ---------- الحركات ---------- */
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes fadeScale{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes arcIn{to{stroke-dasharray:var(--l) 1000}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(107,139,239,.55)}70%,100%{box-shadow:0 0 0 9px rgba(107,139,239,0)}}
@keyframes driftA{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(90px,70px,0) scale(1.12)}}
@keyframes driftB{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-80px,-60px,0) scale(1.1)}}

/* ---------- الشاشات المتوسطة والكبيرة ---------- */
@media (max-width:479px){
  .brand-name{display:none}
  .status-pill{font-size:.74rem;padding:7px 12px}
  .btn{padding-inline:20px;font-size:.96rem}
  .cta-block,.cta-block .btn{width:100%}
}
@media (min-width:640px){
  .sec{padding:104px 0}
  .facts{grid-template-columns:repeat(4,1fr);gap:24px}
  .solution{grid-template-columns:minmax(0,340px) 1fr;align-items:center;gap:44px;padding:48px 52px}
  .join-meta{max-width:30em}
}
@media (min-width:900px){
  .wrap{padding-inline:32px}
  .site-header{padding:26px 0}
  .sticky-cta{display:none}
  .site-footer{padding-bottom:36px}
  .hero{padding:132px 0 64px}
  .hero-grid{grid-template-columns:1.18fr .82fr;gap:56px}
  .ring{width:min(100%,430px)}
  .facts{margin-top:64px}
  .facts strong{font-size:3rem;height:3.2rem}

  .steps{grid-template-columns:repeat(3,1fr);gap:40px;padding-top:34px}
  .steps::before{content:"";position:absolute;inset-inline:32px;inset-block-start:30px;height:2px;background:linear-gradient(90deg,var(--royal),rgba(49,87,213,.15));transform:scaleX(0);transform-origin:right;animation:none}
  .step{padding-inline-start:0;padding-top:50px}
  .step::before{display:none}
  .node{inset-inline-start:0;inset-block-start:-34px;width:64px;height:64px;border-radius:20px}
  .journey-grid{grid-template-columns:260px 1fr;gap:80px;align-items:start}
  .day-meter{display:block;position:sticky;top:18vh;align-self:start}
  .dm-label{font-size:.85rem;color:var(--on-dark-2)}
  .dm-num{font-size:9rem;line-height:1;font-weight:200;letter-spacing:-.05em;color:#fff;font-variant-numeric:tabular-nums;min-height:1em}
  .dm-of{font-size:1rem;color:var(--sky);margin-bottom:26px}
  .dm-segs{display:flex;gap:6px;height:6px}
  .dm-segs i{display:block;border-radius:6px;background:rgba(238,242,251,.16);transition:background-color .5s var(--ease)}
  .dm-segs i.on{background:var(--royal-l)}
  .timeline{padding-inline-start:64px}
  .timeline::before,.timeline::after{inset-inline-start:11px}
  .phase{grid-template-columns:230px 1fr;gap:34px;align-items:start;padding-bottom:72px}
  .pdot{inset-inline-start:-64px;inset-block-start:16px}
  .pbody{padding-top:8px}

  .why-grid{grid-template-columns:1.25fr .75fr;gap:80px;align-items:start}
  .founder{padding:36px 32px}
  .join-grid{grid-template-columns:auto 1fr;gap:80px}
}

/* خط الخطوات الأفقي: يظهر عند دخول القسم */
@media (min-width:900px){
  .steps::before{transition:transform 1.4s var(--ease) .3s}
  .steps:has(.step.in)::before{transform:scaleX(1)}
}

/* ---------- تقليل الحركة ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
  .draw{stroke-dashoffset:0}
  .arc{stroke-dasharray:var(--l) 1000}
  .sol-dot{opacity:1;transform:none}
  .step::before{transform:scaleY(1)}
  .steps::before,.after-steps::before{transform:scaleX(1)}
  .astep::before{transform:scaleY(1)}
  .phase{opacity:1}
}