/* ==========================================================================
   وِرد — قسم «جرّب التطبيق» : هاتف جالاكسي S26 بتجربة حقيقية
   ========================================================================== */
.try{padding-top:24px;padding-bottom:56px;overflow-x:hidden;overflow-x:clip}
.try .wrap{max-width:1180px}
.try-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:76px;align-items:center}
.try-side{max-width:540px}
.try-side .kicker{margin-bottom:6px}
.try-side h2{font-size:44px;margin:14px 0 14px}
.try-side h2 em{font-style:normal;background:linear-gradient(120deg,#cfe0ff,#8fb4ff 45%,#f0c458);-webkit-background-clip:text;background-clip:text;color:transparent}
.try-side .sub{margin-bottom:28px}

.try-steps{list-style:none;margin:0 0 30px;padding:0;display:flex;flex-direction:column;gap:14px}
.try-steps li{display:flex;gap:14px;align-items:flex-start;font-size:16.5px;line-height:1.75;color:#cfd8ee}
.try-steps .n{flex:none;width:30px;height:30px;margin-top:1px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-family:'El Messiri',serif;font-size:15px;font-weight:700;color:#f0c458;background:rgba(240,196,88,.12);border:1px solid rgba(240,196,88,.32)}

.try-label{display:block;font-size:13.5px;color:#8b9ac0;letter-spacing:.04em;margin:0 0 12px}
.try-jump{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 28px}
.tj{appearance:none;font:inherit;cursor:pointer;text-align:start;display:flex;align-items:center;gap:12px;min-height:60px;padding:9px 14px;border-radius:16px;
  color:#e9eefc;background:linear-gradient(180deg,rgba(18,32,66,.85),rgba(10,18,40,.85));border:1px solid rgba(143,180,255,.2);
  transition:transform .25s,border-color .25s,background .25s,box-shadow .25s}
.tj:hover{transform:translateY(-2px);border-color:rgba(143,180,255,.55);box-shadow:0 14px 28px -20px rgba(90,140,240,.95);background:linear-gradient(180deg,rgba(24,42,86,.95),rgba(12,22,48,.95))}
.tj:active{transform:translateY(0)}
.tj .ti{flex:none;width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#9dbcff;background:rgba(70,110,220,.16);border:1px solid rgba(143,180,255,.26)}
.tj .ti svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tj b{display:block;font-size:15.5px;font-weight:600;line-height:1.35}
.tj small{display:block;font-size:12.5px;color:#8b9ac0;line-height:1.4;margin-top:1px}

.try-cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
button.pill{font-family:inherit;cursor:pointer}
.pill.ghost{background:transparent}
.pill .ic2{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.try-note{margin:20px 0 0;font-size:13.5px;line-height:1.85;color:#7c88a6}
.try-note b{color:#9aa8c7;font-weight:600}

/* hero shortcut */
.try-hero{margin-top:14px}
.try-pill{height:50px;padding:0 22px;font-size:15.5px;font-weight:600;color:#f0c458;border-color:rgba(240,196,88,.4);background:rgba(240,196,88,.08)}
.try-pill:hover{color:#ffe7ae;border-color:rgba(240,196,88,.75);background:rgba(240,196,88,.15)}
.try-pill .play{width:22px;height:22px;border-radius:50%;background:#f0c458;color:#1a1205;display:inline-flex;align-items:center;justify-content:center}
.try-pill .play svg{width:9px;height:9px;fill:currentColor;margin-inline-start:-1px;transform:scaleX(var(--flip,1))}
.try-pill .live{width:7px;height:7px;border-radius:50%;background:#53e0a0;box-shadow:0 0 0 0 rgba(83,224,160,.7);animation:livep 2s infinite}
@keyframes livep{70%{box-shadow:0 0 0 8px rgba(83,224,160,0)}100%{box-shadow:0 0 0 0 rgba(83,224,160,0)}}

/* ---------- المسرح ---------- */
.try-stage{position:relative;display:flex;justify-content:center;align-items:flex-start;min-width:0;width:446px;max-width:100%}
.try-stage:before{content:"";position:absolute;left:50%;top:50%;width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(70,110,220,.30),rgba(240,196,88,.07) 45%,transparent 68%)}
.try-ros{position:absolute;left:50%;top:50%;width:620px;height:620px;margin:-310px 0 0 -310px;opacity:.5;pointer-events:none;animation:spin 180s linear infinite}
.gx-fit{position:relative;width:calc(378px*var(--s,1));height:calc(798px*var(--s,1));flex:none}
.gx{position:absolute;left:0;top:0;width:378px;height:798px;transform:scale(var(--s,1));transform-origin:0 0;direction:ltr;
  font-family:'Tajawal','Manrope',sans-serif;-webkit-tap-highlight-color:transparent}

/* الهيكل المعدني */
.gx-body{position:absolute;inset:0;border-radius:56px;background:#05070d;
  box-shadow:0 70px 110px -34px rgba(0,0,0,.85),0 34px 70px -34px rgba(70,110,220,.45),0 0 0 1px rgba(143,180,255,.12)}
.gx-body:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:3.5px;z-index:4;pointer-events:none;
  background:linear-gradient(140deg,#c3cde6 0%,#56618a 16%,#1b2342 36%,#8794b6 50%,#2a3354 68%,#a7b3d1 84%,#56618a 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.gx-body:after{content:"";position:absolute;inset:3.5px;border-radius:52.5px;z-index:4;pointer-events:none;
  box-shadow:inset 0 0 0 5.5px #05070d,inset 0 0 0 6.2px rgba(255,255,255,.07)}
.gx-btn{position:absolute;right:-4px;width:5px;border-radius:0 3px 3px 0;z-index:0;border:0;padding:0;
  background:linear-gradient(90deg,#161d38,#7482a8 58%,#b4bfda);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.22)}
.gx-vol{top:168px;height:82px}
.gx-pwr{top:284px;height:50px;cursor:pointer;transition:transform .15s,filter .2s}
.gx-pwr:hover{filter:brightness(1.35);transform:translateX(1px)}
.gx-pwr:active{transform:translateX(2px)}
.gx-pwr:focus-visible{outline:2px solid #f0c458;outline-offset:3px}

.gx-screen{position:absolute;inset:9px;border-radius:47px;overflow:hidden;background:#000;z-index:1;
  clip-path:inset(0 round 47px);-webkit-clip-path:inset(0 round 47px);isolation:isolate;
  --bar:#070e21;--bar2:#070e21}
.gx-cam{position:absolute;top:21px;left:50%;margin-left:-6.5px;width:13px;height:13px;border-radius:50%;z-index:6;pointer-events:none;
  background:radial-gradient(circle at 34% 30%,#34518f 0,#0b1226 36%,#02040a 72%);
  box-shadow:0 0 0 1.6px #000,0 0 0 2.4px rgba(255,255,255,.05),inset 0 0 3px rgba(120,160,255,.55)}
.gx-gloss{position:absolute;inset:9px;border-radius:47px;z-index:7;pointer-events:none;
  background:linear-gradient(118deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,0) 26%,rgba(255,255,255,0) 70%,rgba(255,255,255,.04) 100%)}

/* التطبيق نفسه */
.gx-frame{position:absolute;left:0;top:36px;width:360px;height:722px;border:0;background:#070e21;opacity:0;transition:opacity .45s ease;z-index:1}
.gx[data-state="run"] .gx-frame{opacity:1}

/* شريط الحالة وشريط الإيماءات */
.gx-sb{position:absolute;left:0;right:0;top:0;height:36px;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:0 32px 0 34px;
  font:600 13.5px/1 'Manrope','Tajawal',sans-serif;color:#fff;background:var(--bar);transition:background .4s,color .4s;pointer-events:none;letter-spacing:.01em}
.gx-sb.lt{color:#0b1226}
.gx-sb .l,.gx-sb .r{display:flex;align-items:center;gap:6px}
.gx-sb svg{height:12.5px;width:auto;fill:currentColor;display:block}
.gx-sb .bt{display:flex;align-items:center;gap:3px;font-size:12px}
.gx-gest{position:absolute;left:0;right:0;bottom:0;height:22px;z-index:6;display:flex;align-items:center;justify-content:center;background:var(--bar2);transition:background .4s;color:#fff;pointer-events:none}
.gx-gest.lt{color:#0b1226}
.gx-gest i{width:112px;height:4.5px;border-radius:3px;background:currentColor;opacity:.78}
.gx[data-lock="1"] .gx-sb,.gx[data-state="loading"] .gx-sb{background:transparent}
.gx[data-lock="1"] .gx-gest,.gx[data-state="loading"] .gx-gest{background:transparent;color:#fff}
.gx[data-lock="1"] .gx-sb,.gx[data-state="loading"] .gx-sb{color:#fff}

/* شاشة التحميل */
.gx-splash{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 38px;
  background:radial-gradient(90% 55% at 50% 38%,rgba(70,110,220,.38),transparent 70%),radial-gradient(70% 40% at 50% 100%,rgba(240,196,88,.14),transparent 70%),#070e21;
  opacity:0;pointer-events:none;transition:opacity .45s;direction:rtl}
.gx[data-state="loading"] .gx-splash{opacity:1}
.sp-ico{position:relative;width:104px;height:104px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.sp-ico img{width:78px;height:78px;border-radius:20px;box-shadow:0 14px 34px rgba(0,0,0,.6),0 0 0 1px rgba(232,184,75,.4),0 0 50px rgba(70,110,220,.5)}
.sp-ico svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 1.3s linear infinite}
.sp-ico circle{fill:none;stroke:#f0c458;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:70 200}
.sp-t{font-family:'Aref Ruqaa',serif;font-size:34px;font-weight:700;color:#f0c458;line-height:1.2;margin:0 0 12px}
.sp-tip{min-height:50px;font-size:14.5px;line-height:1.75;color:#aebbd8;margin:0;transition:opacity .35s}
.sp-bar{width:180px;height:4px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden;margin:2px auto 0}
.sp-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9dbcff,#f0c458);transition:width .25s}
.sp-slow{margin:14px 0 0;font-size:12.5px;line-height:1.7;color:#8b9ac0}
.sp-slow a{color:#9dbcff;text-decoration:underline}

/* شاشة القفل */
.gx-lock{position:absolute;inset:0;z-index:5;cursor:pointer;touch-action:none;overflow:hidden;color:#fff;
  background:radial-gradient(120% 58% at 18% 0%,rgba(70,110,220,.62),transparent 62%),radial-gradient(90% 46% at 92% 100%,rgba(240,196,88,.30),transparent 64%),
  radial-gradient(60% 30% at 50% 58%,rgba(70,110,220,.18),transparent 70%),linear-gradient(180deg,#0d1c44,#08122c 62%,#070e21);
  transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .45s}
.gx-lock.drag{transition:none}
.gx[data-lock="0"] .gx-lock{transform:translateY(-104%);opacity:.0;pointer-events:none}
.lk-ros{position:absolute;left:50%;top:222px;width:520px;height:520px;margin:-260px 0 0 -260px;opacity:.16;animation:spin 240s linear infinite;pointer-events:none}
.lk-top{position:relative;padding-top:66px;text-align:center}
.lk-date{font-size:16.5px;font-weight:500;color:#dfe8ff;letter-spacing:.01em}
.lk-hij{font-size:13px;color:#f0c458;margin-top:5px;letter-spacing:.02em}
.lk-time{font:600 104px/1 'Manrope',sans-serif;letter-spacing:-3px;margin:14px 0 0;direction:ltr;
  background:linear-gradient(180deg,#fff 20%,#b9cdff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 18px 50px rgba(70,110,220,.35)}
.lk-nots{position:absolute;left:14px;right:14px;top:326px;display:flex;flex-direction:column;gap:9px}
.lk-n{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;border-radius:22px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.13);
  backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);box-shadow:0 14px 30px -18px rgba(0,0,0,.7);
  animation:nrise .8s cubic-bezier(.2,.8,.2,1) both}
.lk-n:nth-child(2){animation-delay:.18s}
.lk-n img{flex:none;width:34px;height:34px;border-radius:10px}
.lk-n .tx{flex:1;min-width:0;text-align:start}
.lk-n .hd{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:#aebbd8;margin-bottom:3px}
.lk-n b{display:block;font-size:14.5px;font-weight:700;color:#fff;line-height:1.4}
.lk-n p{margin:2px 0 0;font-size:13px;line-height:1.55;color:#cdd8f3}
@keyframes nrise{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.lk-bot{position:absolute;left:0;right:0;bottom:30px;text-align:center}
.lk-chev{width:26px;height:26px;margin:0 auto 6px;display:block;fill:none;stroke:#f0c458;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;animation:chev 1.8s ease-in-out infinite}
@keyframes chev{0%,100%{transform:translateY(5px);opacity:.45}50%{transform:translateY(-5px);opacity:1}}
.lk-hint{font-size:16px;font-weight:700;color:#fff}
.lk-sub{font-size:12.5px;color:#aebbd8;margin-top:5px}

/* الشاشة المطفأة (Always-on display) */
.gx-off{position:absolute;inset:0;z-index:9;background:#000;opacity:0;pointer-events:none;transition:opacity .4s;display:flex;flex-direction:column;align-items:center;padding-top:150px;cursor:pointer}
.gx[data-off="1"] .gx-off{opacity:1;pointer-events:auto}
.aod-t{font:300 66px/1 'Manrope',sans-serif;color:rgba(223,232,255,.34);letter-spacing:-1px}
.aod-d{margin-top:12px;font-size:14px;color:rgba(223,232,255,.28)}

/* رسالة المساعدة تحت الهاتف */
.try-toast{position:absolute;left:50%;bottom:-6px;transform:translate(-50%,20px);z-index:20;max-width:340px;width:max-content;padding:11px 18px;border-radius:14px;text-align:center;
  font-size:14px;line-height:1.7;color:#1a1205;font-weight:600;background:linear-gradient(135deg,#f7dc9c,#e0aa42);box-shadow:0 18px 40px -16px rgba(0,0,0,.8);
  opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.try-toast.on{opacity:1;transform:translate(-50%,0)}

/* ملء الشاشة على الجوّال */
.try-full{position:fixed;inset:0;z-index:2000;background:#070e21;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px)}
.tf-bar{flex:none;height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#0a1228;border-bottom:1px solid rgba(143,180,255,.16);color:#cfd8ee;font-size:15px;font-weight:600}
.tf-x{appearance:none;font:inherit;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;border:1px solid rgba(143,180,255,.3);background:rgba(18,32,66,.8);color:#cfe0ff;cursor:pointer}
.tf-frame{flex:1 1 auto;width:100%;border:0;background:#070e21;min-height:0}
.tf-load{position:absolute;left:0;right:0;top:46px;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:0 30px;
  background:radial-gradient(90% 50% at 50% 40%,rgba(70,110,220,.35),transparent 70%),#070e21;color:#aebbd8;font-size:14.5px;line-height:1.8;transition:opacity .4s}
.tf-load.hide{opacity:0;pointer-events:none}
.tf-load .sp-ico{margin:0}
body.try-lock{overflow:hidden}

@media (max-width:1100px){
 .try-grid{grid-template-columns:1fr;gap:34px;justify-items:center}
 .try-side{max-width:640px;text-align:center}
 .try-steps li{text-align:start}
 .try-steps{max-width:520px;margin-inline:auto}
 .try-cta{justify-content:center}
 .try-side .shead-like{justify-content:center}
 .try-jump{max-width:560px;margin-inline:auto}
 .try-side h2{font-size:38px}
}
@media (max-width:640px){
 .try{padding-bottom:28px}
 .try-side h2{font-size:30px}
 .try-jump{grid-template-columns:1fr 1fr;gap:8px}
 .tj{padding:8px 10px;gap:9px;min-height:56px}
 .tj small{display:none}
 .try-stage{width:100%}
 .try-hero{display:flex;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
 .try-ros,.lk-ros,.sp-ico svg,.lk-chev,.lk-n,.try-pill .live{animation:none}
 .gx-lock{transition:none}
}
