/* ═══════════════════════════════════════════════════════════
   إعلانات إليف · الصفحة الأم v4 · جولة 2 (Stage-1B)
   قماش واحد متصل · مرجاني قائد · كحلي نصوص · ذهبي بريميوم فقط
   بطاقة مزود قياسية واحدة · صور حقيقية من التطبيق · جهاز 3D
   ═══════════════════════════════════════════════════════════ */

/* ─── الخط: Yanson (محلي) ─── */
@font-face{font-family:'Yanson';src:url('../assets/fonts/Yanson-Light.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Yanson';src:url('../assets/fonts/Yanson-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Yanson';src:url('../assets/fonts/Yanson-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}

/* ─── Tokens ─── */
:root{
  --coral:#D65A56; --coral-soft:#E59897; --blush:#F0C7C5; --cream:#FCF2F1; --maroon:#521614;
  --navy:#202046; --iris:#48469D; --lav:#8179B9; --lilac:#BFBBDD; --ghost:#F7F7FB;
  --gold-bg:#FFF9ED; --gold-1:#FDE7AB; --gold-2:#FFDC85; --gold-ink:#B08A3E;
  --blue-bg:#EDF8FE; --blue-1:#B9E5F4; --blue-2:#8CD6EE; --teal:#0093AC; --teal-deep:#005766;
  --ink:#202046;
  --muted:rgba(32,32,70,.66);
  --line:rgba(32,32,70,.09);
  --shadow-s:0 2px 10px rgba(82,22,20,.06);
  --shadow-m:0 10px 34px rgba(82,22,20,.10);
  --shadow-l:0 26px 70px rgba(82,22,20,.16);
  --spring:cubic-bezier(.22,1.15,.32,1);
  --ease-std:cubic-bezier(.4,0,.2,1);
  --font-num:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI','Helvetica Neue',Arial,sans-serif;
  --fs-display:clamp(2.05rem,3.6vw + .7rem,3.25rem);
  --fs-h2:clamp(1.45rem,2vw + .55rem,2.05rem);
  --fs-h3:clamp(1.28rem,1.4vw + .6rem,1.62rem);
  --fs-body:.98rem;
  --fs-sec:.85rem;
  --fs-cap:.76rem;
  --phw:clamp(248px,23vw,304px);
  --phh:calc(var(--phw) * 2.047);
  --rail-w:46%;
  --header-h:72px;
}
/* spring حقيقي بـ linear() حيث يدعمه المتصفح (لحظات الهيرو) */
@supports (animation-timing-function: linear(0, 1)){
  :root{--spring-l:linear(0,.006,.024 2.9%,.098 5.8%,.712 15.9%,.898 19.9%,1.028,1.107,1.144 29.4%,1.148,1.142,1.126 35.5%,1.062 41.8%,1.008 48.4%,.987,.98 57.9%,.983 64.6%,1.002 82%,1)}
  .lc{animation-timing-function:var(--spring-l)}
  .ph3d{animation-timing-function:var(--spring-l)}
}

/* ─── Base ─── */
*,*::before,*::after{box-sizing:border-box}
/* لا snap على مستوى الصفحة: الانسيابية طبيعية خارج الحلول ·
   الالتقاط داخل رحلة الحلول فقط عبر مساعد سكون التمرير (js) */
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip}
body{
  margin:0;font-family:'Yanson',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-weight:400;color:var(--ink);background:#fff;
  line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;overflow-x:clip;
}
img,svg{max-width:100%}
a{color:var(--iris)}
h1,h2,h3{line-height:1.35;margin:0 0 .5em;font-weight:700}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
.container{width:min(1140px,92%);margin-inline:auto}
.ic{width:1.2em;height:1.2em;display:inline-block;vertical-align:-.22em;flex:none}
.n{font-family:var(--font-num)}
.ryl{width:.82em;height:.82em;vertical-align:-.08em}
:focus-visible{outline:3px solid rgba(214,90,86,.55);outline-offset:2px;border-radius:6px}
.section{padding-block:clamp(64px,9vw,104px)}
section{scroll-margin-top:84px}

/* ─── Grain (حبيبات خفيفة تقتل تسطح التدرجات · SVG inline) ─── */
.grain{
  position:absolute;inset:0;pointer-events:none;opacity:.55;border-radius:inherit;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='260'%20height='260'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.8'%20numOctaves='2'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20type='saturate'%20values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type='linear'%20slope='0.055'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ─── القماش الواحد: فقاعات باستيل عابرة للأقسام ─── */
.canvas{position:fixed;inset:-32% 0;z-index:-1;overflow:hidden;pointer-events:none;will-change:transform}
.cv{position:absolute;border-radius:50%;filter:blur(72px)}
.cv-a{width:560px;height:560px;background:var(--blush);opacity:.5;top:2%;inset-inline-end:-140px;animation:cvdrift 26s ease-in-out infinite alternate}
.cv-b{width:500px;height:500px;background:var(--gold-1);opacity:.4;top:16%;inset-inline-start:-160px;animation:cvdrift 32s 2s ease-in-out infinite alternate-reverse}
.cv-c{width:430px;height:430px;background:var(--cream);opacity:.85;top:42%;inset-inline-end:8%;animation:cvdrift 30s 1s ease-in-out infinite alternate}
.cv-d{width:380px;height:380px;background:var(--blue-bg);opacity:.7;top:62%;inset-inline-start:-90px;animation:cvdrift 34s ease-in-out infinite alternate}
.cv-e{width:460px;height:460px;background:var(--blush);opacity:.32;top:82%;inset-inline-end:-120px;animation:cvdrift 28s 3s ease-in-out infinite alternate-reverse}
@keyframes cvdrift{from{transform:translate(0,0) scale(1)}to{transform:translate(30px,-26px) scale(1.05)}}

/* ─── شريط التقدم ─── */
.progress{
  position:fixed;top:0;inset-inline:0;height:3px;z-index:80;background:var(--coral);
  transform:scaleX(var(--sp,0));transform-origin:100% 50%;
}

/* ─── أزرار ─── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  border-radius:999px;font-weight:700;font-family:inherit;text-decoration:none;cursor:pointer;
  border:1.5px solid transparent;transition:transform .2s var(--ease-std),box-shadow .2s var(--ease-std),border-color .2s,background .2s;
  padding:.72em 1.6em;font-size:1rem;line-height:1.4;
}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--coral);color:#fff;box-shadow:0 8px 22px rgba(214,90,86,.35)}
.btn-ghost{border-color:var(--lilac);color:var(--navy);background:rgba(255,255,255,.6)}
.btn-lg{padding:.9em 2em;font-size:1.06rem}
.btn-sm{padding:.5em 1.2em;font-size:.92rem}
.btn-block{width:100%}
/* نبضة CTA واحدة خفيفة جداً عند أول ظهور */
.cta-pulse{animation:lcin .7s var(--spring) .38s both,ctapulse 1.6s 1.5s ease-in-out 1}
@keyframes ctapulse{0%,100%{transform:scale(1)}40%{transform:scale(1.035)}70%{transform:scale(.995)}}

/* ─── Header (مدمج · يصغر · يختفي ويعود) ─── */
.site-header{
  position:fixed;inset-inline:0;top:0;z-index:60;background:transparent;
  transition:transform .4s var(--ease-std),background .3s,box-shadow .3s;
}
.site-header.hid{transform:translateY(-110%)}
.site-header.scrolled{
  background:rgba(252,242,241,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow-s);
}
.header-in{display:flex;align-items:center;justify-content:space-between;min-height:var(--header-h);transition:min-height .3s}
.site-header.scrolled .header-in{min-height:56px}
.brand{display:inline-flex;align-items:center;gap:.55em;text-decoration:none;color:var(--navy)}
.brand-mark svg{height:24px;width:auto;color:var(--coral);display:block;transition:height .3s}
.site-header.scrolled .brand-mark svg{height:19px}
.brand-name{font-size:1.02rem;font-weight:700;color:var(--navy)}

/* ═══════════ منطقة الرحلة ═══════════ */
.flight{position:relative}

/* السكة (دسكتوب) */
.rail{position:absolute;inset-block:0;inset-inline-end:0;width:var(--rail-w);pointer-events:none;z-index:5}
.rail-stick{
  position:sticky;top:calc(50svh - var(--phh)/2 + 14px);
  display:flex;justify-content:center;perspective:1100px;
  transition:opacity .55s var(--ease-std),transform .7s var(--spring);
}
/* مغادرة الجهاز بعد الهيرو وعودته عند الحلول */
.rail-stick.fly-out{opacity:0;transform:translateY(-11vh) scale(.9)}
.ph3d{
  --fly:0;--sway:0deg;
  transform:rotateX(calc(7deg - var(--fly)*2.5deg)) rotateY(calc(-19deg + var(--fly)*11deg)) rotateZ(var(--sway)) scale(calc(1 - var(--fly)*.05));
  transform-style:preserve-3d;will-change:transform;
  animation:phone-in 1.1s .25s var(--spring) both;
}
@keyframes phone-in{from{opacity:0;transform:translateY(44px) rotateY(-28deg)}to{opacity:1}}
.ph-idle{position:relative;animation:idle 8s ease-in-out infinite alternate;transform-style:preserve-3d}
@keyframes idle{from{transform:translateY(0) rotateZ(0)}to{transform:translateY(-9px) rotateZ(.5deg)}}

/* ─── هيكل الآيفون 3D ─── */
.iphone{
  position:relative;width:var(--phw);aspect-ratio:71.6/146.6;
  border-radius:calc(var(--phw)*.185);
  background:linear-gradient(150deg,#4d4d66 0%,#1c1c30 42%,#12121f 60%,#3a3a54 100%);
  transform-style:preserve-3d;
  box-shadow:
    var(--shadow-l),
    0 6px 18px rgba(32,32,70,.25),
    inset 0 0 0 1px rgba(255,255,255,.17),
    inset -2px 0 3px rgba(255,255,255,.10),
    inset 2px 0 4px rgba(0,0,0,.35);
}
/* سماكة الجسم: طبقة خلفية بعمق حقيقي تظهر حافتها مع الميلان */
.ip-edge{
  position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(150deg,#3f3f58 0%,#101020 50%,#2c2c44 100%);
  transform:translateZ(calc(var(--phw)*-.048));
  box-shadow:0 0 0 1px rgba(255,255,255,.06);
}
.iphone::before{ /* البيزل الأسود */
  content:"";position:absolute;inset:calc(var(--phw)*.011);
  border-radius:calc(var(--phw)*.174);background:#0b0b16;
}
.ip-btn{position:absolute;background:linear-gradient(90deg,#454560,#20203a);border-radius:3px}
.ip-power{inset-inline-start:auto;right:calc(var(--phw)*-.010);top:29%;width:calc(var(--phw)*.014);height:9.5%}
.ip-vol1{left:calc(var(--phw)*-.010);top:24%;width:calc(var(--phw)*.014);height:5.4%}
.ip-vol2{left:calc(var(--phw)*-.010);top:31%;width:calc(var(--phw)*.014);height:5.4%}
.ip-mute{left:calc(var(--phw)*-.010);top:17.6%;width:calc(var(--phw)*.014);height:3.2%}
.ip-screen{
  position:absolute;inset:calc(var(--phw)*.030);
  border-radius:calc(var(--phw)*.152);background:#fff;overflow:hidden;
  font-size:calc(var(--phw)*.0385);line-height:1.5;
  /* تسطيح محتوى الشاشة في مستوى واحد: iOS Safari كان يرتب البطاقات المتحركة
     والتاب بار خلف الشاشة داخل preserve-3d فتختفي (عيب «قائمة المراكز تختفي») */
  transform:translateZ(0);transform-style:flat;isolation:isolate;
}
.ip-screen::after{ /* انعكاس زجاجي ساكن خفيف */
  content:"";position:absolute;inset:0;z-index:20;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,0) 24%);
  border-radius:inherit;
}
/* لمعان زجاجي قطري يتحرك مع التمرير */
.ip-sheen{
  position:absolute;inset:0;z-index:21;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.20) 46%,rgba(255,255,255,.04) 55%,transparent 68%);
  transform:translateX(calc(65% - var(--fly,0)*135%));
}
.ip-island{
  position:absolute;top:calc(var(--phw)*.032);left:50%;transform:translateX(-50%);
  width:calc(var(--phw)*.295);height:calc(var(--phw)*.078);border-radius:99px;background:#0b0b16;z-index:15;
}
/* ظل أرضي ديناميكي يتحرك مع الميلان */
.ph-shadow{
  position:absolute;left:50%;bottom:calc(var(--phw)*-.16);
  width:82%;height:calc(var(--phw)*.10);border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(32,32,70,.30),rgba(32,32,70,0) 72%);
  filter:blur(6px);
  transform:translateX(calc(-50% + var(--sway,0deg)/1deg*3px)) scaleX(calc(1 - var(--fly,0)*.12));
  animation:idle-sh 8s ease-in-out infinite alternate;
}
@keyframes idle-sh{from{opacity:1}to{opacity:.72}}

/* مؤشر تقدم الفصول (دسكتوب · عمودي بجانب الجهاز) */
.jprog{
  position:absolute;inset-inline-start:calc(50% + var(--phw)/2 + 30px);top:50%;
  transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;
  opacity:0;transition:opacity .4s;
}
.jprog.show{opacity:1}
.jprog i{width:8px;height:8px;border-radius:99px;background:var(--lilac);transition:background .3s,height .3s,width .3s}
.jprog i.on{background:var(--coral);height:24px}

/* ─── المشاهد ─── */
.scene{
  position:absolute;inset:0;display:flex;flex-direction:column;
  padding:.75em .95em 0;opacity:0;transform:translateY(16px) scale(.98);
  transition:opacity .5s var(--ease-std),transform .8s var(--spring);
  pointer-events:none;overflow:hidden;
  background:
    radial-gradient(70% 34% at 82% -4%,rgba(253,231,171,.5) 0%,rgba(253,231,171,0) 70%),
    radial-gradient(74% 40% at 6% 2%,rgba(240,199,197,.55) 0%,rgba(240,199,197,0) 70%),
    #FBF8F7;
}
@supports (animation-timing-function: linear(0, 1)){
  .scene{transition:opacity .5s var(--ease-std),transform .8s var(--spring-l)}
}
.scene.on{opacity:1;transform:none}
/* ارتداد استقرار الجهاز عند تبدل المشهد (يضاف settle-run من الجافاسكربت) */
@keyframes ph-settle{
  0%{transform:translateY(0) rotateX(0)}
  32%{transform:translateY(9px) rotateX(3.2deg)}
  64%{transform:translateY(-3px) rotateX(-1.2deg)}
  100%{transform:translateY(0) rotateX(0)}
}
/* بلا fill دائم: transform مستمر على الجهاز يفجّر خلل تسطيح preserve-3d في iOS Safari
   (يُخفي البطاقات والتاب بار وكل ذي z-index داخل الشاشة) · الكلاس يُزال عند نهاية الأنيميشن */
.settle-run .iphone,.iphone.settle-run{animation:ph-settle .78s cubic-bezier(.3,1.1,.35,1)}

/* تدرج التركيز الأبيض: يركز على القسم الأعلى ويخفت ما تحته */
.sc-focus-top::after,.sc-focus-bottom::after{
  content:"";position:absolute;inset-inline:0;bottom:0;z-index:5;pointer-events:none;
  background:linear-gradient(180deg,rgba(251,248,247,0) 0%,rgba(251,248,247,.86) 55%,rgba(251,248,247,.97) 100%);
}
.sc-focus-top::after{height:46%}
.sc-focus-bottom::after{height:38%}
.dimmed{opacity:.92}

/* توهج بطاقة المعلن (بديل تاق «إعلان») */
.ad-glow{
  position:relative;border:1.5px solid var(--coral) !important;
  box-shadow:0 0 0 3px rgba(214,90,86,.13),0 6px 20px rgba(214,90,86,.34) !important;
  z-index:2;
}
.scene.on .ad-glow{animation:adpulse 2.8s ease-in-out infinite}
@keyframes adpulse{
  0%,100%{box-shadow:0 0 0 3px rgba(214,90,86,.13),0 6px 20px rgba(214,90,86,.30)}
  50%{box-shadow:0 0 0 5px rgba(214,90,86,.20),0 8px 28px rgba(214,90,86,.48)}
}

/* ─── مكوّنات التطبيق (مطابقة الواجهة الحقيقية 1:1) ─── */
.ap-status{display:flex;justify-content:space-between;align-items:center;padding:.15em .9em 0 .55em;font-size:.86em;font-weight:700}
.ap-sig{display:inline-flex;gap:.25em;align-items:center}
.ap-sig i{width:1.15em;height:.7em;background:var(--navy);opacity:.85;display:inline-block;border-radius:.12em}
.ap-sig i:nth-child(1){clip-path:polygon(0 100%,100% 0,100% 100%)}
.ap-sig i:nth-child(2){clip-path:polygon(50% 100%,0 30%,15% 12%,85% 12%,100% 30%);border-radius:0}
.ap-sig i:nth-child(3){width:1.5em;border:.09em solid var(--navy);background:linear-gradient(90deg,var(--navy) 70%,transparent 70%)}
.ap-logo{display:flex;justify-content:center;margin:.6em 0 .15em}
.ap-logo svg{height:2em;width:auto;color:#141428}
.ap-logo.dim svg{opacity:.4}
.ap-logo-sm svg{height:2.3em;width:auto;color:#141428;display:block}
.ap-city{
  display:flex;justify-content:center;align-items:center;gap:.3em;
  font-size:.92em;font-weight:400;color:var(--navy);margin-bottom:.6em;
}
.ap-city .ic{color:var(--coral)}
.ap-city .ap-cty-ch{transform:rotate(-90deg);width:.8em;height:.8em;color:var(--muted)}
.ap-city.sm{margin:0;font-size:.95em}
.ap-compact{display:flex;justify-content:space-between;align-items:center;padding:1.05em .35em .75em}
.ap-bub{position:absolute;border-radius:50%;filter:blur(1.6em);z-index:-1}
.bub-1{width:11em;height:11em;background:var(--blush);opacity:.65;top:-3em;inset-inline-start:-3em}
.bub-2{width:9em;height:9em;background:var(--gold-1);opacity:.5;top:1em;inset-inline-end:-2.5em}
.ap-search{
  display:flex;align-items:center;gap:.5em;background:#fff;border-radius:999px;
  padding:.62em 1em;color:rgba(32,32,70,.42);font-size:.92em;box-shadow:0 .15em .6em rgba(32,32,70,.07);
  margin-bottom:.55em;white-space:nowrap;overflow:hidden;
}
.ap-search .ic{color:var(--coral-soft)}
.ap-search.boxed{border-radius:.8em}
.ap-search.typed{color:var(--navy);font-weight:400;flex:1;margin-bottom:0}
.caret{width:.09em;height:1.05em;background:var(--coral);display:inline-block;margin-inline-start:.15em}
.sc-search.on .caret{animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.ap-searchrow{display:flex;gap:.5em;align-items:center;margin-bottom:.55em}
.ap-mapbtn{
  width:2.4em;height:2.4em;border-radius:.8em;background:var(--cream);color:var(--coral);
  display:inline-flex;align-items:center;justify-content:center;flex:none;
}
/* بانر مصمم بأسلوب شرائح الإعلانات (بديل بانر العضويات الحقيقي المزدحم) */
.ap-banner-design{
  position:relative;width:100%;aspect-ratio:2.25/1;border-radius:1em;overflow:hidden;
  background:linear-gradient(125deg,var(--coral) 8%,var(--maroon) 105%);
  display:flex;align-items:flex-end;padding:.8em;color:#fff;margin-bottom:.7em;
}
.ap-banner-design::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 82% 18%,rgba(255,255,255,.3),transparent 70%)}
.bn-t{display:flex;flex-direction:column;line-height:1.45;position:relative}
.bn-t b{font-size:1.05em}
.bn-t small{font-size:.74em;opacity:.88}
.bn-deco{position:absolute;border-radius:50%;background:rgba(255,255,255,.12)}
.bd-1{width:6.5em;height:6.5em;top:-2.2em;inset-inline-end:-2em}
.bd-2{width:4.5em;height:4.5em;bottom:-1.5em;inset-inline-start:-1.4em}
.ap-sechead{display:flex;justify-content:space-between;align-items:baseline;margin:.35em .1em .55em}
.ap-sechead b{font-size:1em;color:#2c2c48}
.ap-sechead.big{margin-top:.9em}
.ap-sechead.big b{font-size:1.18em}
.ap-sechead small{font-size:.78em;color:var(--navy);display:inline-flex;align-items:center;gap:.3em;font-weight:400}
.ap-cats{display:flex;justify-content:space-between;gap:.3em;margin-bottom:.75em;text-align:center}
.ap-cats span{display:flex;flex-direction:column;align-items:center;gap:.32em;font-size:.74em;color:#2c2c48;font-weight:400;flex:1;min-width:0;white-space:nowrap}
.ct{width:3.2em;height:3.2em;border-radius:1.05em;display:block;object-fit:cover}

/* ═══ بطاقة المزود القياسية (تُبنى مرة وتُستخدم حرفياً في كل مشهد) ═══
   القياسات من التطبيق الحي: الصورة 1.22:1 · النص ≈ 0.365 من العرض */
.ac{
  background:#fff;border-radius:1.05em;border:1px solid var(--line);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 .15em .5em rgba(32,32,70,.05);
  padding-bottom:.55em;min-width:0;
}
.ac-ph{display:block;width:100%;aspect-ratio:1.22/1;object-fit:cover;flex:none}
.ac-row{display:flex;justify-content:space-between;align-items:center;gap:.3em;padding:.5em .6em 0}
.ac-row b{font-size:.82em;color:#26264a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-rate{display:inline-flex;align-items:center;gap:.2em;font-size:.72em;color:var(--navy);flex:none}
.ac-rate .st{color:#E9B949;width:1em;height:1em}
.ac-addr{display:block;padding:.18em .74em 0;font-size:.66em;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-foot{display:flex;justify-content:space-between;align-items:center;padding:.5em .6em 0}
.ac-km{font-size:.64em;color:var(--muted);display:inline-flex;align-items:center;gap:.25em}
.ac-km .ic{width:1em;height:1em}
.ac-chip{font-style:normal;font-size:.62em;font-weight:400;color:var(--navy);border:1px solid var(--line);border-radius:.7em;padding:.2em .75em;background:#fff}

/* النسخة العريضة (صفوف «بالقرب مني» و«الرائج» · صورة 2.15:1) */
.ap-wrow{display:flex;gap:.6em;align-items:flex-start;margin-bottom:.55em}
.ac-wide{flex:0 0 76%}
.ac-wide .ac-ph{aspect-ratio:2.15/1}

/* شبكة العمودين (المراكز · البحث · القوائم) · static grid بارتفاعات متطابقة */
.ap-grid2{display:grid;grid-template-columns:1fr 1fr;gap:.58em .6em;align-items:start;margin-bottom:.45em}

/* دورة الارتقاء: المعلن من أسفل-يسار إلى أول القائمة والبقية تفسح
   الإزاحات نسبية لقياس البطاقة نفسها (بطاقات متطابقة = مواقع مضبوطة) */
.grid-rise .g-a,.grid-climb .g-a{animation:none}
.sc-home.on .grid-rise .g-d{animation:rise-ad 9s var(--spring) infinite}
.sc-home.on .grid-rise .g-a{animation:rise-p1 9s var(--spring) infinite}
.sc-home.on .grid-rise .g-b{animation:rise-p2 9s var(--spring) infinite}
.sc-home.on .grid-rise .g-c{animation:rise-p3 9s var(--spring) infinite}
.sc-rank.on .grid-climb .g-d{animation:rise-ad 8s 1s var(--spring) infinite}
.sc-rank.on .grid-climb .g-a{animation:rise-p1 8s 1s var(--spring) infinite}
.sc-rank.on .grid-climb .g-b{animation:rise-p2 8s 1s var(--spring) infinite}
.sc-rank.on .grid-climb .g-c{animation:rise-p3 8s 1s var(--spring) infinite}
@keyframes rise-ad{ /* أسفل-يسار ← أعلى-يمين (الأول) */
  0%,10%{transform:translate(0,0)}
  24%,82%{transform:translate(calc(100% + .55em),calc(-100% - .5em))}
  96%,100%{transform:translate(0,0)}
}
@keyframes rise-p1{ /* الأول ← الثاني */
  0%,10%{transform:translate(0,0)}
  24%,82%{transform:translateX(calc(-100% - .55em))}
  96%,100%{transform:translate(0,0)}
}
@keyframes rise-p2{ /* الثاني ← الثالث */
  0%,10%{transform:translate(0,0)}
  24%,82%{transform:translate(calc(100% + .55em),calc(100% + .5em))}
  96%,100%{transform:translate(0,0)}
}
@keyframes rise-p3{ /* الثالث ← الرابع */
  0%,10%{transform:translate(0,0)}
  24%,82%{transform:translateX(calc(-100% - .55em))}
  96%,100%{transform:translate(0,0)}
}
/* ظهور نتيجة البحث الأولى */
.sc-search .ac-pop{opacity:0;transform:translateY(-8%);transition:opacity .5s .5s,transform .6s .5s var(--spring)}
.sc-search.on .ac-pop{opacity:1;transform:translate(0,0)}
.sc-trend.on .ap-wrow .ad-glow{animation:adpulse 2.8s ease-in-out infinite,tr-bob 5s ease-in-out infinite alternate}
@keyframes tr-bob{from{transform:translateY(0)}to{transform:translateY(-.4em)}}

/* رأس صفحة داخلية + pills */
.ap-pghead{display:flex;align-items:center;gap:.5em;padding:.9em .2em .55em;font-size:1em;color:#26264a;font-weight:700}
.ap-pghead.nopad{padding:2.4em 0 .3em}
.ap-pghead b{flex:1;text-align:center}
.ap-pghead.side{padding-top:2.5em}
.ap-pghead.side b{flex:none;text-align:start}
.pg-back{transform:rotate(180deg);color:var(--navy)}
.ap-pills{display:flex;gap:.45em;margin-bottom:.65em;overflow:hidden}
.ap-pills span{
  border:1px solid var(--line);background:#fff;border-radius:999px;
  padding:.3em .85em;font-size:.7em;font-weight:400;color:var(--muted);white-space:nowrap;flex:none;
}
.ap-pills span.on{background:var(--coral);border-color:var(--coral);color:#fff}
/* نمط pills صفحة البحث الحقيقي: النشطة بيضاء بنص مرجاني */
.ap-pills.lite span{background:#F3F1F8;border-color:transparent;color:var(--navy)}
.ap-pills.lite span.on{background:#fff;border-color:rgba(214,90,86,.3);color:var(--coral);box-shadow:0 .1em .3em rgba(32,32,70,.08)}
.ap-divider{
  display:flex;align-items:center;gap:.7em;color:var(--muted);font-size:.72em;margin-bottom:.55em;
}
.ap-divider::before,.ap-divider::after{content:"";height:1px;background:var(--line);flex:1}

/* رأس صفحة العروض */
.ap-offershead{
  margin:-0.75em -0.95em .65em;padding:.4em .95em .75em;
  background:linear-gradient(180deg,#F6D9D7 0%,rgba(246,217,215,0) 100%);
}
.oh-title{display:block;font-size:1.1em;color:#3a3a5c;margin-top:.1em}
.oh-title .ic{color:var(--coral)}
.ap-offershead small{display:block;font-size:.7em;color:var(--muted)}

/* بطاقة العرض (نسبة التطبيق الحقيقية ≈ 2.45:1 · السعر يسار · الفئة يمين) */
.ap-offers{display:flex;flex-direction:column;gap:.72em;flex:1;min-height:0}
/* بطاقة مقصوصة بأسفل الشاشة: إيحاء استمرار القائمة (بلا محتوى مخترع) */
.oc-cut{aspect-ratio:auto;flex:1;min-height:2.2em;border-radius:1.05em 1.05em 0 0;border-bottom:0}
.oc-cut::after{background:linear-gradient(180deg,rgba(20,20,40,0) 55%,rgba(20,20,40,.28) 100%)}
.oc{position:relative;border-radius:1.05em;overflow:hidden;aspect-ratio:2.45/1;flex:none;display:block;border:1px solid var(--line)}
.oc-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.oc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,40,0) 30%,rgba(20,20,40,.58) 100%)}
.oc-price{
  position:absolute;top:.6em;inset-inline-end:.6em;z-index:2;font-style:normal;
  background:var(--coral);color:#fff;font-weight:700;font-size:.78em;
  border-radius:999px;padding:.25em .8em;display:inline-flex;align-items:center;gap:.25em;
}
.oc-cat{
  position:absolute;top:.6em;inset-inline-start:.6em;z-index:2;font-style:normal;
  background:#fff;color:#3a3a5c;font-weight:400;font-size:.72em;border-radius:999px;padding:.25em .9em;
}
.oc-body{position:absolute;inset-inline:.7em;bottom:1.4em;z-index:2;color:#fff}
.oc-body b{display:block;font-size:.88em;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oc-provider{display:flex;align-items:center;gap:.35em;font-size:.7em;opacity:.95}
.oc-provider i{width:1.3em;height:1.3em;border-radius:50%;background:rgba(255,255,255,.8);display:inline-block}
.oc-date{position:absolute;bottom:.55em;inset-inline-end:.7em;z-index:2;color:#fff;font-size:.66em;display:inline-flex;align-items:center;gap:.3em;opacity:.95}
.oc .shine{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);
  transform:translateX(130%);
}
.sc-offers.on .shine{animation:shine 4.2s ease-in-out infinite}
@keyframes shine{0%{transform:translateX(130%)}55%,100%{transform:translateX(-130%)}}

/* السلايدر (أعلى ارتفاعاً · تباعد منطقي · بلا تداخل) */
.ap-slider{margin-bottom:.65em;overflow:hidden;border-radius:1.1em}
.sl-track{display:flex;gap:.6em}
.sc-slider.on .sl-track{animation:sl-go 8.4s ease-in-out infinite}
@keyframes sl-go{
  0%,26%{transform:translateX(0)}
  33%,59%{transform:translateX(calc(100% + .6em))}
  66%,92%{transform:translateX(calc(200% + 1.2em))}
  100%{transform:translateX(0)}
}
.sl-slide{position:relative;flex:0 0 100%;aspect-ratio:2.25/1;border-radius:1.1em;overflow:hidden;display:flex;align-items:flex-end;padding:.8em;color:#fff}
.sl-slide .sl-t{display:flex;flex-direction:column;line-height:1.45;position:relative;z-index:1}
.sl-slide b{font-size:1.05em}
.sl-slide small{font-size:.74em;opacity:.88}
.sl-ad{background:linear-gradient(125deg,var(--coral) 8%,var(--maroon) 105%)}
.sl-ad::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(60% 60% at 82% 18%,rgba(255,255,255,.3),transparent 70%)}
/* إطار المعلن داخل السلايدر: حلقة داخلية بلا ظل خارجي (الظل الخارجي كان يظهر خطأً داخل سياق القص) */
.sl-ring{box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
.sl-gold{background:linear-gradient(125deg,#EFC96F 0%,#B08A3E 120%)}
.sl-gold::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(60% 60% at 18% 16%,rgba(255,255,255,.28),transparent 70%)}
.sl-c{background:linear-gradient(125deg,var(--blue-2),var(--teal))}
.sl-dots{display:flex;gap:.35em;justify-content:center;margin-top:.55em}
.sl-dots i{width:.42em;height:.42em;border-radius:99px;background:var(--lilac)}
.sc-slider.on .sl-dots .d1{animation:d-on 8.4s ease-in-out infinite}
@keyframes d-on{0%,29%{background:var(--coral);width:1.1em}33%,96%{background:var(--lilac);width:.42em}100%{background:var(--coral);width:1.1em}}

/* البوب أب (يظهر بتأخير بسيط بعد استقرار المشهد) */
.pu-ghost{display:flex;flex-direction:column;gap:.6em;padding-top:.4em;filter:blur(.06em)}
.gh-line{height:.7em;border-radius:.4em;background:rgba(32,32,70,.10);width:56%}
.gh-card{height:4.4em;border-radius:1em;background:rgba(32,32,70,.07)}
.pu-veil{position:absolute;inset:0;background:rgba(24,24,44,.5);opacity:0;z-index:3;transition:opacity .5s 1s}
.sc-popup.on .pu-veil{opacity:1}
.pu-card{
  position:absolute;inset-inline:1.1em;top:3.4em;bottom:3.2em;z-index:4;
  background:#fff;border-radius:1.3em;overflow:hidden;display:flex;flex-direction:column;
  opacity:0;transform:translateY(4%) scale(.92);
  transition:opacity .5s 1.25s,transform .65s 1.25s var(--spring);
}
.sc-popup.on .pu-card{opacity:1;transform:none}
.pu-x{
  position:absolute;top:.6em;inset-inline-end:.6em;z-index:6;width:1.7em;height:1.7em;border-radius:50%;
  background:rgba(255,255,255,.92);color:#3a3a5c;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 .1em .4em rgba(20,20,40,.2);
}
.pu-x .ic{width:.85em;height:.85em}
.pu-art{
  flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3em;
  background:linear-gradient(150deg,#D97B74 0%,var(--coral) 45%,var(--maroon) 130%);color:#fff;text-align:center;padding:1em;
}
.pu-deco{position:absolute;border-radius:50%;background:rgba(255,255,255,.14)}
.pd-1{width:7em;height:7em;top:-2.4em;inset-inline-end:-2.2em}
.pd-2{width:5em;height:5em;bottom:-1.6em;inset-inline-start:-1.6em}
.pu-mark svg{height:1.6em;width:auto;color:#fff;opacity:.95}
.pu-art b{font-size:1.25em}
.pu-art small{font-size:.78em;opacity:.92}
.pu-cta{
  margin-top:.55em;background:#fff;color:var(--maroon);font-weight:700;font-size:.78em;
  border-radius:999px;padding:.45em 1.5em;
}

/* تاب بار التطبيق (الرئيسية أول عنصر من اليمين) */
.ap-tabbar{
  position:absolute;inset-inline:0;bottom:0;z-index:10;
  display:flex;justify-content:space-around;align-items:flex-start;
  border-top:1px solid var(--line);padding:.6em .9em calc(.6em + var(--phw)*.02);
  color:#9a97b8;background:rgba(255,255,255,.96);
}
.ap-tabbar .ic{width:1.35em;height:1.35em}
.ap-tabbar span{position:relative;display:flex;flex-direction:column;align-items:center;gap:.15em}
.ap-tabbar small{font-size:.62em;font-weight:400}
.ap-tabbar .on{color:#26264a}
.tb-line{position:absolute;top:-.62em;width:1.8em;height:.18em;border-radius:2px;background:#26264a}

/* ═══════════ الهيرو ═══════════ */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:center;
  padding-top:calc(var(--header-h) + 24px);padding-bottom:40px;
}
.hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
/* المستطيلات المائلة من هوية إليف (عادت بقرار جولة 2) */
.tilt-card{
  position:absolute;border-radius:14px;
  background:linear-gradient(120deg,rgba(240,199,197,.42),rgba(252,242,241,.75));
  border:1px solid rgba(214,90,86,.10);box-shadow:0 8px 24px rgba(82,22,20,.05);
}
.tc-1{width:170px;height:56px;top:17%;inset-inline-start:4%;transform:rotate(-8deg);animation:bob 9s ease-in-out infinite alternate}
.tc-2{width:118px;height:42px;bottom:19%;inset-inline-start:11%;transform:rotate(6deg);animation:bob 11s 1s ease-in-out infinite alternate-reverse}
.tc-3{width:140px;height:48px;top:11%;inset-inline-end:7%;transform:rotate(7deg);animation:bob 13s .5s ease-in-out infinite alternate}
@keyframes bob{from{translate:0 0}to{translate:0 -14px}}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--rail-w);align-items:center}
.hero-copy{max-width:600px}
.hero-title{font-size:var(--fs-display);line-height:1.3;color:var(--navy);margin-bottom:.4em}
.hero-title em{font-style:normal;color:var(--coral);position:relative;white-space:nowrap;z-index:0}
.hero-title em::after{
  content:"";position:absolute;z-index:-1;inset-inline:-3%;bottom:.06em;height:.24em;border-radius:99px;
  background:linear-gradient(90deg,var(--blush),var(--coral-soft));
  transform:scaleX(0);transform-origin:100% 50%;animation:drawline .8s .75s var(--spring) forwards;
}
@keyframes drawline{to{transform:scaleX(1)}}
.hero-sub{font-size:clamp(1rem,1.3vw,1.14rem);color:var(--muted);max-width:52ch;margin-bottom:1.6em}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:1.8em}
.trust-strip{
  display:flex;align-items:center;gap:.7em;flex-wrap:wrap;
  font-size:var(--fs-sec);color:var(--muted);margin:0;
}
.trust-strip span{white-space:nowrap}
.trust-strip i{font-style:normal;color:var(--coral);font-weight:700}
.hero-stage{min-height:10px}

/* اختيار العنوان: تتابع الدخول */
.lc{opacity:0;transform:translateY(22px);animation:lcin .7s var(--spring) forwards}
.lc-1{animation-delay:.12s}.lc-2{animation-delay:.24s}.lc-3{animation-delay:.38s}.lc-4{animation-delay:.52s}
@keyframes lcin{to{opacity:1;transform:none}}

/* ═══════════ عناوين الأقسام ═══════════ */
.sec-title{font-size:var(--fs-h2);text-align:center;color:var(--navy)}
.sec-title.start{text-align:start}
.sec-lead{text-align:center;color:var(--muted);max-width:60ch;margin-inline:auto;margin-bottom:clamp(28px,4vw,48px);font-size:var(--fs-body)}
.sec-lead.start{text-align:start;margin-inline:0}

/* عمود المحتوى بجانب سكة الجهاز (فصول الحلول فقط · «لماذا» صارت بكامل العرض) */
.flight-col{padding-inline-end:calc(var(--rail-w) + 20px)}

/* ═══════════ §2 لماذا (3 خيارات بنية عرض · كامل العرض) ═══════════ */
.why-lead{font-size:clamp(1.05rem,1.5vw,1.3rem);color:var(--navy);font-weight:700;max-width:44ch;line-height:1.7;margin-bottom:clamp(28px,4vw,44px)}
.why-v[hidden]{display:none}

/* الخيار ١ · سطور ضخمة تتلوّن تدريجياً مع التمرير */
.why-v1{max-width:1040px}
.wk{margin:0;padding-block:clamp(20px,3vw,30px)}
.wk + .wk{border-top:1px solid var(--line)}
.wk-k{display:block;color:var(--coral);font-weight:700;font-size:var(--fs-sec);margin-bottom:.55em}
.wk-line{
  display:block;font-weight:700;line-height:1.62;
  font-size:clamp(1.3rem,2.4vw + .5rem,2.2rem);
  background:linear-gradient(to left,var(--navy) calc(var(--p,1)*112% - 6%),rgba(32,32,70,.16) calc(var(--p,1)*112%));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* الخيار ٢ · سطر عريض بتقسيم غير متماثل + رمز خطي كبير باهت */
.why-v2{max-width:1080px}
.wr{
  position:relative;display:grid;grid-template-columns:minmax(180px,300px) minmax(0,1fr);gap:8px 44px;
  align-items:baseline;padding-block:clamp(26px,3.4vw,38px);border-top:1px solid var(--line);overflow:hidden;
}
.wr-1{border-top:0}
.wr-2{margin-inline-start:8%}
.wr-3{margin-inline-start:3%}
.wr-4{margin-inline-start:12%}
.wr h3{font-size:clamp(1.3rem,1.6vw + .5rem,1.7rem);color:var(--coral);margin:0}
.wr p{margin:0;color:var(--muted);font-size:var(--fs-body);max-width:52ch}
.wr-g{
  position:absolute;inset-inline-end:-1%;top:50%;transform:translateY(-50%) rotate(8deg);
  width:clamp(120px,14vw,190px);height:clamp(120px,14vw,190px);
  color:var(--coral);opacity:.10;pointer-events:none;
}

/* الخيار ٣ · شريط أفقي قصير من ألواح ناعمة بعرض الصفحة */
.why-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.6vw,18px)}
.wp{border-radius:20px;padding:clamp(18px,2.2vw,26px) clamp(16px,2vw,24px);border:1px solid transparent}
.wp h3{font-size:1.06rem;color:var(--coral);margin-bottom:.45em}
.wp p{margin:0;color:var(--muted);font-size:var(--fs-sec);line-height:1.85}
.wp-1{background:var(--cream);border-color:rgba(240,199,197,.6)}
.wp-2{background:var(--ghost);border-color:rgba(191,187,221,.4);border-radius:26px}
.wp-3{background:var(--gold-bg);border-color:rgba(253,231,171,.75)}
.wp-4{background:var(--blue-bg);border-color:rgba(185,229,244,.6);border-radius:14px}

/* ═══════════ نوعا الإعلان (بعد الحلول) ═══════════ */
.types{display:flex;flex-direction:column;gap:6px;max-width:560px;margin-inline:auto}
.type-card{
  background:rgba(255,255,255,.72);border:1px solid rgba(240,199,197,.65);border-radius:22px;
  padding:24px 26px;transition:transform .2s var(--spring),box-shadow .2s;
}
.type-card h3{font-size:1.15rem;margin-bottom:.3em}
.type-card p{color:var(--muted);font-size:var(--fs-body);margin-bottom:.5em}
.type-fit{font-size:var(--fs-sec);color:var(--iris);font-weight:700;margin:0 !important}
.type-or{
  align-self:center;width:44px;height:44px;border-radius:50%;background:var(--cream);
  color:var(--coral);font-weight:700;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--blush);z-index:1;margin-block:-14px;font-size:.95rem;
}
.type-viz{display:flex;gap:6px;margin-bottom:14px}
.viz-imp i{width:10px;height:10px;border-radius:50%;background:var(--coral-soft);opacity:.35}
.reveal.in .viz-imp i{animation:imp-pulse 2.6s ease-in-out infinite}
.viz-imp i:nth-child(2){animation-delay:.25s}.viz-imp i:nth-child(3){animation-delay:.5s}
.viz-imp i:nth-child(4){animation-delay:.75s}.viz-imp i:nth-child(5){animation-delay:1s}
@keyframes imp-pulse{0%,100%{opacity:.35;transform:scale(1)}30%{opacity:1;transform:scale(1.25)}}
.viz-days i{width:16px;height:10px;border-radius:3px;background:var(--blush);opacity:.4}
.reveal.in .viz-days i{background:var(--coral-soft);opacity:1;transition:background .5s,opacity .5s}
.reveal.in .viz-days i:nth-child(1){transition-delay:.1s}
.reveal.in .viz-days i:nth-child(2){transition-delay:.22s}
.reveal.in .viz-days i:nth-child(3){transition-delay:.34s}
.reveal.in .viz-days i:nth-child(4){transition-delay:.46s}
.reveal.in .viz-days i:nth-child(5){transition-delay:.58s}
.reveal.in .viz-days i:nth-child(6){transition-delay:.7s}
.reveal.in .viz-days i:nth-child(7){transition-delay:.82s}
.types-note{margin-top:22px;color:var(--navy);font-weight:700;font-size:var(--fs-body);text-align:center}

/* ═══════════ §3 الحلول · الفصول ═══════════ */
.journey{padding-bottom:0}
.chapters{display:flex;flex-direction:column}
.ch{min-height:86svh;display:flex;flex-direction:column;justify-content:center;max-width:56ch;padding-block:30px}
.ch-kicker{font-size:var(--fs-sec);font-weight:700;color:var(--coral);margin-bottom:.4em}
.ch h3{font-size:var(--fs-h3);color:var(--navy);margin-bottom:.35em}
.ch-desc{color:var(--muted);font-size:var(--fs-body);margin-bottom:.5em;max-width:46ch}
.ch-fit{font-size:var(--fs-sec);color:var(--iris);font-weight:700;margin-bottom:1.1em}
.gold-note{
  display:inline-block;background:var(--gold-bg);border:1px solid var(--gold-1);border-radius:12px;
  padding:.55em 1em;font-size:var(--fs-sec);color:var(--navy);margin-bottom:1.1em;max-width:max-content;
}
.gold-note b{color:var(--gold-ink)}
.ch-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px dashed var(--line);padding-top:16px}
.price{color:var(--navy);font-size:var(--fs-sec);display:inline-flex;align-items:baseline;gap:.3em}
.price b{color:var(--coral);font-size:1.55rem;font-weight:700;line-height:1}
.price .ryl{color:var(--coral);width:.95em;height:.95em;align-self:center}
.price small{color:var(--muted);font-size:.8rem}
.more{
  display:inline-flex;align-items:center;gap:.3em;color:var(--iris);text-decoration:none;
  font-weight:700;font-size:.88rem;border-radius:999px;padding:.35em .9em;border:1px solid transparent;
  transition:border-color .2s,background .2s;
}
.ch.on-stage .ch-kicker{color:var(--maroon)}

/* جهاز الجولة (موبايل) */
.jmob{display:none}

/* ═══════════ §5 المقارنة ═══════════ */
.cmp-panel{
  display:grid;grid-template-columns:1fr 1fr;max-width:920px;margin-inline:auto;
  background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow-m);overflow:hidden;
}
.cmp-lane{padding:clamp(22px,3.5vw,36px);display:flex;flex-direction:column;gap:16px}
.cmp-lane + .cmp-lane{border-inline-start:1px solid var(--line)}
.cmp-elef{background:linear-gradient(180deg,rgba(252,242,241,.7),rgba(252,242,241,0) 80%)}
.cmp-head{display:flex;flex-direction:column;gap:6px}
.cmp-badge{
  display:inline-flex;align-items:center;gap:.45em;width:max-content;
  background:var(--ghost);color:var(--navy);font-weight:700;font-size:.92rem;
  border-radius:12px;padding:.45em 1em;
}
.cmp-badge.b-coral{background:var(--coral);color:#fff}
.cmp-badge.b-coral .ic{color:var(--gold-1)}
.cmp-cost{margin:0;font-size:var(--fs-sec);color:var(--muted)}
.cmp-days{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;max-width:300px}
.cmp-days i{aspect-ratio:1;border-radius:5px;background:rgba(32,32,70,.07)}
.lane-day i.lit{background:linear-gradient(135deg,var(--lilac),var(--lav))}
.cmp-panel.in .lane-day i.lit{animation:day-fade 5.5s ease-in-out infinite}
@keyframes day-fade{0%,18%{opacity:1}55%,80%{opacity:.16}100%{opacity:1}}
.lane-month i{transform:scale(0);background:linear-gradient(135deg,var(--coral-soft),var(--coral))}
.cmp-panel.in .lane-month i{animation:dotin .4s var(--spring) forwards;animation-delay:calc(var(--i,0)*.045s)}
@keyframes dotin{to{transform:scale(1)}}
.cmp-line{margin:0;color:var(--muted);font-size:var(--fs-sec)}
.cmp-elef .cmp-line{color:var(--navy);font-weight:700}

/* ═══════════ §6 الضمان ═══════════ */
.guarantee{
  background:radial-gradient(60% 80% at 85% 20%,rgba(237,248,254,.85) 0%,rgba(237,248,254,0) 70%);
}
.g-grid{display:grid;gap:clamp(30px,5vw,60px);align-items:center}
.g-main{font-size:clamp(1.1rem,1.7vw,1.35rem);font-weight:700;color:var(--navy);line-height:1.8;max-width:36ch}
.g-sub{color:var(--muted);font-size:var(--fs-body);max-width:44ch}
.g-visual{display:flex;justify-content:center}
.g-report{
  background:#fff;border:1px solid var(--blue-1);border-radius:26px;box-shadow:var(--shadow-m);
  padding:26px 28px;width:min(380px,100%);
}
.g-rep-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:20px}
.g-rep-head b{color:var(--navy)}
.g-demo{color:var(--muted);font-size:var(--fs-cap);border:1px dashed var(--lilac);border-radius:8px;padding:.15em .7em}
.g-meter-wrap{margin-bottom:22px}
.g-meter-labels{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;color:var(--muted);font-size:var(--fs-sec)}
.g-pct-label b{color:var(--teal-deep);font-size:1.5rem;font-weight:700}
.g-pct-label i{font-style:normal;color:var(--teal-deep);font-weight:700}
.g-meter{position:relative;height:16px;border-radius:99px;background:var(--ghost);overflow:hidden}
.g-fill{
  position:absolute;inset-block:0;inset-inline-start:0;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--blue-2),var(--teal));
  transition:width 1.5s .3s var(--ease-std);
}
.g-visual.in .g-fill{width:82%}
.g-gap{
  position:absolute;inset-block:3px;inset-inline-end:3px;width:calc(18% - 4px);border-radius:99px;
  background:repeating-linear-gradient(-55deg,var(--blush) 0 5px,rgba(240,199,197,.35) 5px 10px);
  opacity:0;transition:opacity .5s 1.7s;
}
.g-visual.in .g-gap{opacity:1;animation:gap-glow 2.6s 2s ease-in-out infinite}
@keyframes gap-glow{0%,100%{box-shadow:0 0 0 0 rgba(214,90,86,0)}50%{box-shadow:0 0 0 4px rgba(214,90,86,.18)}}
.g-refund{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:6px}
.g-chip{
  display:inline-flex;align-items:center;gap:.4em;background:var(--coral);color:#fff;
  font-size:.82rem;font-weight:700;border-radius:99px;padding:.4em 1em;
  opacity:0;transform:translateX(8px);transition:all .6s 2.1s var(--spring);
}
.g-visual.in .g-chip{opacity:1;transform:translateX(0)}
.g-arrow{width:26px;border-top:2px dashed var(--coral);position:relative;opacity:0;transition:opacity .4s 2.4s}
.g-arrow::after{
  content:"";position:absolute;inset-inline-end:-2px;top:-5px;border:4px solid transparent;
  border-inline-start:6px solid var(--coral);
}
.g-visual.in .g-arrow{opacity:1}
.g-wallet{
  width:46px;height:46px;border-radius:15px;background:var(--cream);color:var(--maroon);
  display:inline-flex;align-items:center;justify-content:center;
}
.g-wallet .ic{width:23px;height:23px}
.g-visual.in .g-wallet{animation:wallet-pop .6s 2.6s var(--spring)}
@keyframes wallet-pop{40%{transform:scale(1.18)}}
.g-note{display:flex;align-items:center;justify-content:center;color:var(--maroon);font-size:var(--fs-sec);font-weight:700;margin:8px 0 0}

/* ═══════════ §7 المحفظة ═══════════ */
.ladder{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,2vw,22px);
  align-items:end;max-width:840px;margin-inline:auto;
}
.step{display:flex;flex-direction:column;align-items:center;gap:10px}
.bonus-chip{
  background:#fff;border:1.4px solid var(--coral);color:var(--coral);
  font-size:clamp(.66rem,1.3vw,.84rem);font-weight:700;border-radius:99px;padding:.32em .8em;white-space:nowrap;
  opacity:0;transform:translateY(6px) scale(.9);transition:all .5s var(--spring);
}
.step-gold .bonus-chip{background:var(--gold-bg);border-color:var(--gold-2);color:var(--gold-ink)}
.bar{
  position:relative;width:100%;height:calc(var(--h) * clamp(140px,21vw,215px) + 52px);
  border-radius:15px 15px 9px 9px;overflow:hidden;
  background:linear-gradient(180deg,var(--coral-soft),var(--coral));
  display:flex;align-items:flex-end;justify-content:center;
  color:#fff;padding-bottom:12px;line-height:1.2;
  transform:scaleY(0);transform-origin:bottom;transition:transform .8s var(--spring);
  box-shadow:0 10px 26px rgba(214,90,86,.25);
}
.bar-in{display:inline-flex;align-items:center;gap:.25em}
.bar b{font-size:clamp(.92rem,2.2vw,1.28rem)}
.bar .ryl{color:#fff;width:.8em;height:.8em}
.bar .cap{ /* الرصيد الإضافي: تعبئة أفتح مقصوصة بقطر العمود نفسه + خط فاصل متقطع واضح · بلا توهج */
  position:absolute;top:0;inset-inline:0;height:calc(var(--cap) * 100%);min-height:14px;
  background:rgba(255,255,255,.44);
  border-bottom:2px dashed rgba(82,22,20,.34);
  opacity:0;transition:opacity .5s .7s;
}
.ladder.in .cap{opacity:1}
.step-gold .bar{
  background:linear-gradient(180deg,#F3CE79,var(--gold-2) 45%,#EEC463);
  color:var(--maroon);box-shadow:0 12px 30px rgba(255,220,133,.55);
}
.step-gold .bar .ryl{color:var(--maroon)}
.step-gold .bar .cap{background:rgba(255,255,255,.5);border-bottom-color:rgba(82,22,20,.42)}
.ladder.in .bar{transform:scaleY(1)}
.ladder.in .bonus-chip{opacity:1;transform:translateY(0) scale(1)}
.ladder .step:nth-child(1) .bar{transition-delay:.05s}
.ladder .step:nth-child(2) .bar{transition-delay:.2s}
.ladder .step:nth-child(3) .bar{transition-delay:.35s}
.ladder .step:nth-child(4) .bar{transition-delay:.5s}
.ladder .step:nth-child(1) .bonus-chip{transition-delay:.55s}
.ladder .step:nth-child(2) .bonus-chip{transition-delay:.7s}
.ladder .step:nth-child(3) .bonus-chip{transition-delay:.85s}
.ladder .step:nth-child(4) .bonus-chip{transition-delay:1s}
.step-total{font-size:clamp(.68rem,1.4vw,.84rem);color:var(--muted);display:inline-flex;align-items:center;gap:.25em}
.step-total b{color:var(--navy)}
.step-total .ryl.sm{width:.7em;height:.7em;color:var(--navy)}
.ladder-hint{text-align:center;color:var(--muted);font-size:var(--fs-sec);margin:18px 0 0}
.wallet-one{
  margin:clamp(24px,4vw,40px) auto 0;max-width:560px;text-align:center;
  display:flex;align-items:center;justify-content:center;gap:.6em;flex-wrap:wrap;
  background:var(--cream);border:1px solid var(--blush);border-radius:18px;
  padding:.8em 1.6em;font-weight:700;color:var(--navy);
}
.wallet-one > .ic{color:var(--coral)}

/* ═══════════ §8 الطلب (فاتح) ═══════════ */
.order-panel{
  position:relative;overflow:hidden;
  background:linear-gradient(155deg,var(--gold-bg) 0%,var(--cream) 55%,#fff 130%);
  border:1px solid rgba(240,199,197,.8);
  border-radius:30px;padding:clamp(28px,5vw,54px);color:var(--ink);
  display:grid;gap:clamp(26px,4vw,46px);box-shadow:var(--shadow-m);
}
.order-panel::before{
  content:"";position:absolute;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(240,199,197,.5) 0%,rgba(240,199,197,0) 70%);
  top:-160px;inset-inline-end:-120px;pointer-events:none;
}
.order-intro{position:relative}
.order-intro h2{font-size:var(--fs-h2);color:var(--navy)}
.order-intro p{color:var(--muted);max-width:52ch;font-size:var(--fs-body);margin:0}
.order-form{
  position:relative;background:#fff;border-radius:22px;padding:clamp(20px,3vw,30px);
  display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-s);border:1px solid var(--line);
}
.f-row{display:flex;flex-direction:column;gap:6px;border:0;padding:0;margin:0;min-inline-size:0}
.f-row label,.f-row legend{font-weight:700;font-size:var(--fs-sec);color:var(--navy);padding:0}
.f-row input[type="text"]{
  font:inherit;padding:.7em 1em;border-radius:12px;border:1.5px solid var(--lilac);
  background:var(--ghost);color:var(--ink);transition:border-color .2s,box-shadow .2s;width:100%;
}
.f-row input[type="text"]:focus{outline:none;border-color:var(--coral);box-shadow:0 0 0 4px rgba(214,90,86,.14);background:#fff}
.f-row input::placeholder{color:rgba(32,32,70,.35)}
.cat-pills{display:flex;gap:8px;flex-wrap:wrap}
.cat-pills label{cursor:pointer}
.cat-pills input{position:absolute;opacity:0;pointer-events:none}
.cat-pills span{
  display:inline-block;border:1.5px solid var(--lilac);border-radius:999px;
  padding:.42em 1.15em;font-weight:700;font-size:.9rem;color:var(--muted);
  transition:all .2s;
}
.cat-pills input:checked + span{background:var(--coral);border-color:var(--coral);color:#fff;box-shadow:0 4px 14px rgba(214,90,86,.3)}
.cat-pills input:focus-visible + span{outline:3px solid rgba(214,90,86,.55);outline-offset:2px}
.form-hint{margin:0;font-size:var(--fs-sec);color:var(--coral);min-height:1.4em;font-weight:700}
.order-direct{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.or-divider{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:var(--fs-sec);width:100%;max-width:380px}
.or-divider::before,.or-divider::after{content:"";height:1px;background:var(--line);flex:1}
.btn-wa{border:1.5px solid var(--coral-soft);color:var(--maroon);background:#fff;padding:.8em 1.8em}
.qr-box{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px 10px;color:var(--muted);
  display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.84rem;box-shadow:var(--shadow-s);
}
.qr-svg{width:132px;height:132px;display:block}
.qr-svg svg{display:block;width:100%;height:100%}

/* ═══════════ Footer ═══════════ */
.site-footer{background:var(--navy);color:var(--lilac);padding-block:52px 40px}
.footer-in{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.f-brand svg{height:40px;width:auto;color:#fff}
.f-line{margin:0;color:rgba(255,255,255,.85);font-size:var(--fs-body)}
.f-rule{width:110px;height:1px;background:rgba(255,255,255,.16)}
.f-copy{margin:0;font-size:var(--fs-cap);color:rgba(191,187,221,.65)}

/* ═══════════ مبدّل المراجعة (أداة مؤقتة · داخل الفوتر) ═══════════ */
.hswitch{
  display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
  max-width:min(92vw,460px);margin-inline:auto;
  background:rgba(255,255,255,.97);
  border:1px solid var(--line);border-radius:22px;padding:8px 14px;box-shadow:var(--shadow-s);
}
.hswitch small{color:var(--muted);font-size:.72rem;font-weight:700}
.hswitch button{
  min-width:28px;height:28px;border-radius:99px;border:1px solid var(--lilac);background:#fff;
  font-family:inherit;font-weight:700;font-size:.8rem;color:var(--navy);cursor:pointer;padding-inline:6px;
}
.hswitch button.on{background:var(--coral);border-color:var(--coral);color:#fff}
.hs-sep{width:1px;height:20px;background:var(--line)}

/* ═══════════ Reveal ═══════════ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s var(--spring)}
.reveal.in{opacity:1;transform:none}
.wr.reveal:nth-child(2),.wp.reveal:nth-child(2){transition-delay:.06s}
.wr.reveal:nth-child(3),.wp.reveal:nth-child(3){transition-delay:.12s}
.wr.reveal:nth-child(4),.wp.reveal:nth-child(4){transition-delay:.18s}

/* ═══════════ Hover (مؤشر دقيق فقط · 200ms) ═══════════ */
@media (hover:hover) and (pointer:fine){
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(214,90,86,.42)}
  .btn-ghost:hover{border-color:var(--iris);transform:translateY(-2px)}
  .btn-wa:hover{background:var(--cream);transform:translateY(-2px)}
  .more:hover{border-color:var(--lilac);background:rgba(255,255,255,.7)}
  .more .ic{transition:transform .2s var(--ease-std)}
  .more:hover .ic{transform:translateX(-3px)}
  .type-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-m)}
  .hswitch button:hover{border-color:var(--coral)}
}

/* ═══════════ موبايل وتابلت (≤980px) ═══════════ */
@media (max-width:980px){
  :root{--phw:min(268px,72vw)}
  .section{padding-block:clamp(78px,13vw,116px)} /* مسافات أكبر بين الأقسام */
  .flight{display:flex;flex-direction:column}
  .hero{order:1;min-height:0;padding-bottom:0}
  .rail{order:2;position:static;width:auto;inset:auto}
  .why{order:3}.journey{order:4}
  .rail-stick{position:static;top:auto;padding:26px 0 10px;perspective:1000px}
  .rail-stick.fly-out{opacity:1;transform:none} /* لا مغادرة على الموبايل */
  .ph3d{transform:rotateX(4deg) rotateY(-11deg)}
  .ph-shadow{bottom:calc(var(--phw)*-.10)}
  .jprog{display:none} /* مؤشر الدسكتوب · للموبايل نسخة أفقية داخل jmob */
  .hero-grid{grid-template-columns:1fr;text-align:center}
  .hero-copy{margin-inline:auto}
  .hero-sub{margin-inline:auto}
  .hero-cta,.trust-strip{justify-content:center}
  .hero-stage{display:none}
  .tc-1{width:120px;height:40px;top:9%}
  .tc-2{display:none}
  .tc-3{width:100px;height:36px;top:5%}
  .flight-col{padding-inline-end:0}
  .sec-title.start,.sec-lead.start{text-align:center}
  .sec-lead.start{margin-inline:auto}
  .why-lead{margin-inline:auto;text-align:center;max-width:34ch}
  /* «لماذا» موبايل · الخيارات الثلاثة */
  .why-v1{max-width:560px;margin-inline:auto}
  .wk{padding-block:24px;text-align:start}
  .wk-line{font-size:clamp(1.16rem,4.8vw,1.5rem)}
  .why-v2{max-width:560px;margin-inline:auto}
  .wr{grid-template-columns:1fr;gap:6px;padding-block:26px;text-align:start}
  .wr-2,.wr-3,.wr-4{margin-inline-start:0}
  .wr-g{inset-inline-end:-9%;width:120px;height:120px;opacity:.08}
  .why-strip{
    display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:12px;
    margin-inline:-4vw;padding-inline:4vw;padding-bottom:10px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .why-strip::-webkit-scrollbar{display:none}
  .wp{flex:0 0 76%;scroll-snap-align:center}
  .types{margin-inline:auto}
  /* تفاصيل الحل أقرب للجهاز · وكل فصل يملأ ما تحت الجهاز بالضبط
     فلا يتسرب الحل التالي إلى العرض عند الاستقرار */
  .ch{
    min-height:calc(100svh - 186px*2.08 - 74px);
    max-width:640px;margin-inline:auto;text-align:center;align-items:center;
    justify-content:flex-start;padding-block:14px 40px;
    scroll-margin-top:calc(186px*2.08 + 74px);
  }
  .ch + .ch{border-top:1px solid rgba(32,32,70,.06)} /* فاصل خفيف بين الحلول */
  .journey{padding-top:clamp(46px,7vw,64px)} /* تقليص الفراغ قبل الجهاز */
  .ch-desc{margin-inline:auto}
  .ch-foot{width:100%;justify-content:center;gap:18px}
  /* جهاز الجولة: يدك أعلى الشاشة والمحتوى تحته */
  .jmob.ready{
    display:flex;flex-direction:column;align-items:center;position:sticky;top:calc(56px + 8px);z-index:40;
    padding:10px 0 12px;--phw:186px;
    transition:top .35s var(--ease-std);
  }
  body.hdr-hid .jmob.ready{top:10px} /* حين يختفي التوب بار يصعد الجهاز مكانه */
  .jmob .iphone-mob{width:var(--phw);box-shadow:var(--shadow-l),0 4px 14px rgba(32,32,70,.22)}
  .jmob::before{ /* خلفية شبه مصمتة بحواف مموهة: بلا خط فاصل مع القسم وبلا نص يظهر خلف الجهاز */
    content:"";position:absolute;inset:-52px -50vw -44px;z-index:-1;
    background:linear-gradient(180deg,
      rgba(252,242,241,0) 0%,rgba(252,242,241,.98) 10%,
      rgba(252,242,241,1) 26%,rgba(252,242,241,1) 86%,
      rgba(252,242,241,0) 100%);
  }
  .ap-banner-design{aspect-ratio:3.2/1} /* بانر أنحف على الشاشة الصغيرة كي تبقى شبكة المراكز ظاهرة */
  /* موك الرئيسية على الجوال: حذف صف الأقسام (بتفويض فيصل) يضمن ظهور شبكة المراكز والتاب بار كاملين */
  .rail .sc-home .sh-cats,.rail .sc-home .ap-cats{display:none}
  .jprog-m{
    position:static;display:flex;flex-direction:row;gap:8px;transform:none;opacity:0;
    margin-top:10px;justify-content:center;transition:opacity .4s;
  }
  .jprog-m.show{opacity:1}
  .jprog-m i.on{width:24px;height:8px}
  .cmp-panel{grid-template-columns:1fr}
  .cmp-lane + .cmp-lane{border-inline-start:0;border-top:1px solid var(--line)}
  .g-grid{grid-template-columns:1fr}
  .g-copy .sec-title,.g-main{text-align:center;margin-inline:auto}
  .g-sub{text-align:center;margin-inline:auto}
}
@media (min-width:981px){
  .g-grid{grid-template-columns:1.05fr .95fr}
  .order-panel{grid-template-columns:1fr 1fr;align-items:center}
  .order-intro{grid-column:1 / -1;text-align:center}
  .order-intro p{margin-inline:auto}
}

/* ═══════════ شاشات صغيرة (≤640px) ═══════════ */
@media (max-width:640px){
  .ladder{grid-template-columns:repeat(2,1fr);row-gap:34px;align-items:end}
  .hero-title{line-height:1.36}
  .hero-cta .btn{flex:1;min-width:150px}
  .cmp-days{max-width:100%}
}

/* ═══════════ fallback بلا JavaScript: لا محتوى يبقى مخفياً ═══════════ */
html:not(.js) .reveal,html:not(.js) .lc{opacity:1;transform:none;animation:none}
html:not(.js) .bar{transform:scaleY(1)}
html:not(.js) .bonus-chip{opacity:1;transform:none}
html:not(.js) .bar .cap{opacity:1}
html:not(.js) .g-fill{width:82%}
html:not(.js) .g-gap{opacity:1}
html:not(.js) .g-chip{opacity:1;transform:none}
html:not(.js) .g-arrow{opacity:1}
html:not(.js) .lane-month i{transform:scale(1)}
html:not(.js) .lane-day i.lit{opacity:1}
html:not(.js) .viz-days i{background:var(--coral-soft);opacity:1}
html:not(.js) .viz-imp i{opacity:1}
html:not(.js) .hswitch{display:none}
html:not(.js) .sc-search .ac-pop{opacity:1;transform:none}
html:not(.js) .pu-veil,html:not(.js) .pu-card{opacity:1;transform:none}
html:not(.js) .jprog,html:not(.js) .jprog-m{display:none}
html:not(.js) .cta-pulse{animation:none;opacity:1}

/* ═══════════ تقليل الحركة ═══════════ */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01s !important;animation-iteration-count:1 !important;
    transition-duration:.01s !important;transition-delay:0s !important;
  }
  .lc,.reveal{opacity:1;transform:none;animation:none}
  .ph3d{animation:none;opacity:1}
  .ph-idle{animation:none}
  .ph-shadow{animation:none}
  .ip-sheen{transform:none}
  .rail-stick{transition:none}
  .rail-stick.fly-out{opacity:1;transform:none}
  .scene{transition:none}
  .sc-search .ac-pop{opacity:1;transform:none;animation:none}
  .pu-veil{opacity:1;animation:none}
  .pu-card{opacity:1;transform:none;animation:none}
  .lane-month i{transform:scale(1);animation:none}
  .lane-day i.lit{animation:none}
  .bar{transform:scaleY(1)}
  .bar .cap{opacity:1;animation:none}
  .settle-run .iphone,.iphone.settle-run{animation:none}
  .bonus-chip{opacity:1;transform:none}
  .g-fill{width:82%;transition:none}
  .g-gap{opacity:1;animation:none}
  .g-chip{opacity:1;transform:none}
  .g-arrow{opacity:1}
  .viz-imp i{opacity:1;animation:none}
  .viz-days i{background:var(--coral-soft);opacity:1}
  .hero-title em::after{transform:scaleX(1);animation:none}
  .ad-glow{animation:none !important}
  .cta-pulse{animation:none;opacity:1}
  .grid-rise .g-a,.grid-rise .g-b,.grid-rise .g-c,.grid-rise .g-d,
  .grid-climb .g-a,.grid-climb .g-b,.grid-climb .g-c,.grid-climb .g-d{animation:none !important}
  .sl-track{animation:none !important}
  .tilt-card{animation:none}
}
