:root{
  --ink:#0B3A52;--ink-2:#082C3F;--river:#1C6E8C;--river-soft:#E3F0F5;--amber:#F2A93B;--amber-soft:#FCEFD8;
  --paper:#FFFFFF;--paper-2:#F5F8FA;--line:#DFE7EC;--text:#132A36;--muted:#58707D;--ok:#1E7A4F;--ok-soft:#E1F3E9;
  --f-display:"Alexandria","IBM Plex Sans Arabic",Tahoma,sans-serif;--f-body:"IBM Plex Sans Arabic",Tahoma,sans-serif;
  --r:18px;--wrap:1160px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper-2);color:var(--text);font-family:var(--f-body);font-size:17px;line-height:1.85;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.35;margin:0;color:var(--ink);font-weight:600}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:13px 22px;font-weight:600;font-size:16px;text-decoration:none;border:1px solid transparent;cursor:pointer;font-family:var(--f-body);transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn.pri{background:var(--amber);color:#1B1300}
.btn.pri:hover{background:#F5B552}
.btn.ghost{border-color:rgba(255,255,255,.35);color:#fff}
.btn.ghost:hover{background:rgba(255,255,255,.08)}
.btn.ink{background:var(--ink);color:#fff}
.btn.line{border-color:var(--line);background:#fff;color:var(--ink)}
.kicker{font-family:var(--f-display);font-size:14px;font-weight:600;color:var(--river);letter-spacing:.2px}
.sec{padding:96px 0}
.sec-h{margin-bottom:44px}
.sec-h h2{font-size:clamp(28px,3.6vw,40px);margin-top:8px}
.sec-h p{color:var(--muted);margin-top:12px;font-size:18px}

/* الرأس */
.nav{position:sticky;top:0;z-index:20;background:rgba(11,58,82,.96);backdrop-filter:saturate(1.4) blur(8px)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:68px}
.nav .logo img{height:40px;width:auto}
.nav nav{display:flex;gap:22px;margin-inline-start:auto}
.nav nav a{color:#CFE0E8;text-decoration:none;font-size:15px}
.nav nav a:hover{color:#fff}
.nav .btn{padding:9px 16px;font-size:15px}

/* البطل */
.hero{background:var(--ink);color:#fff;position:relative;padding:72px 0 80px}
.hero .strings-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero .strings{position:absolute;inset:0;width:100%;height:100%;opacity:.16;pointer-events:none}
.hero .strings path{fill:none;stroke:#fff;stroke-width:1.2}
.hero .strings path.v{stroke:var(--amber);stroke-width:2}
.hero .wrap{position:relative}
.hero .copy{max-width:760px}
.hero .kicker{color:var(--amber)}
.hero h1{color:#fff;font-size:clamp(34px,5.4vw,60px);font-weight:700;margin-top:14px;letter-spacing:-.3px}
.hero p.lead{color:#D5E4EB;font-size:clamp(17px,1.8vw,20px);margin-top:18px;max-width:640px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero .facts{display:flex;gap:10px 22px;flex-wrap:wrap;margin-top:22px;color:#AFC8D4;font-size:14.5px}
.hero .facts span{display:inline-flex;align-items:center;gap:8px}
.hero .facts i{width:7px;height:7px;border-radius:50%;background:var(--amber)}
.shot{border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 30px 80px -30px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06)}
.shot .bar{height:34px;background:#EEF3F6;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid var(--line)}
.shot .bar i{width:10px;height:10px;border-radius:50%;background:#CBD6DD}
.shot .bar span{margin-inline-start:auto;font-size:12px;color:var(--muted);direction:ltr}
.hero .shot{margin-top:56px;position:relative}

/* الخطوات */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:s}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.step b{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:18px;color:var(--ink)}
.step b::before{counter-increment:s;content:counter(s);width:30px;height:30px;border-radius:9px;background:var(--river-soft);color:var(--river);display:grid;place-items:center;font-size:15px}
.step p{color:var(--muted);font-size:15.5px;margin-top:10px}

/* المصادر */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.chip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:15px;font-weight:500;color:var(--ink)}

/* الميزات */
.feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:56px;align-items:center}
.feat+.feat{margin-top:96px}
.feat.flip .txt{order:2}
.feat .txt h3{font-size:clamp(24px,2.8vw,32px);margin-top:8px}
.feat .txt>p{color:var(--muted);margin-top:14px}
.ticks{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px}
.ticks li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:16px}
.ticks li::before{content:"";width:20px;height:20px;border-radius:50%;margin-top:5px;background:var(--ok-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14 7.6' fill='none' stroke='%231E7A4F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.gallery img{border-radius:12px;box-shadow:0 14px 40px -20px rgba(11,58,82,.5)}
.gallery img:first-child{grid-column:1/-1}
.qa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.qa div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}
.qa b{display:block;font-family:var(--f-display);font-size:16px;color:var(--ink)}
.qa span{display:block;color:var(--muted);font-size:14.5px;margin-top:6px;line-height:1.7}

/* الأفكار */
.ideas-sec{background:#fff;border-block:1px solid var(--line)}
.idea-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px}
.idea-list div{border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:var(--paper-2)}
.idea-list b{font-family:var(--f-display);font-size:16px;color:var(--ink)}
.idea-list p{color:var(--muted);font-size:14.5px;margin-top:6px;line-height:1.7}

/* الذكاء */
.ai{background:var(--ink);color:#fff}
.ai h2,.ai h3{color:#fff}
.ai .sec-h p{color:#BFD3DD}
.ai .kicker{color:var(--amber)}
.prov{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.prov div{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:18px}
.prov b{font-family:var(--f-display);font-size:17px}
.prov span{display:block;color:#AFC8D4;font-size:14.5px;margin-top:4px}

/* الأسعار */
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;display:flex;flex-direction:column}
.plan.hl{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink),0 24px 60px -30px rgba(11,58,82,.45)}
.plan .tag{align-self:flex-start;background:var(--amber-soft);color:#7A5200;font-size:13px;font-weight:600;border-radius:999px;padding:3px 12px;margin-bottom:10px}
.plan h3{font-size:20px}
.plan .pr{font-family:var(--f-display);font-size:40px;font-weight:700;color:var(--ink);margin-top:10px;line-height:1.2}
.plan .pr small{font-size:15px;font-weight:500;color:var(--muted)}
.plan .per{color:var(--muted);font-size:14px;min-height:24px}
.plan .ticks{margin-bottom:24px;flex:1;align-content:start}
.plan .ticks li{font-size:15px}
.plan .btn{width:100%}
.note{color:var(--muted);font-size:14.5px;margin-top:22px;text-align:center}

/* الأسئلة */
.faq{display:grid;gap:10px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:4px 24px}
.faq summary{cursor:pointer;font-family:var(--f-display);font-weight:600;color:var(--ink);font-size:17px;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--river);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--muted);padding:0 0 16px}

/* التنزيل */
.get{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:40px}
.get form{display:flex;gap:10px}
.get input{flex:1;min-width:0;border:1px solid var(--line);border-radius:12px;padding:13px 16px;font:16px/1.4 Consolas,monospace;direction:ltr;text-align:left;letter-spacing:.5px}
.get input:focus{outline:2px solid var(--river);outline-offset:1px}
.get small{display:block;color:var(--muted);font-size:14px;margin-top:10px}
.get .err{color:#B3261E}

footer{background:var(--ink-2);color:#AFC8D4;padding:40px 0;font-size:14.5px}
footer .wrap{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
footer img{height:36px;width:auto}
footer span{margin-inline-start:auto}

@media (max-width:980px){
  .steps,.plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .feat,.get{grid-template-columns:minmax(0,1fr);gap:28px}
  .feat.flip .txt{order:0}
  .idea-list,.prov,.qa{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav nav{display:none}
  .nav .btn{margin-inline-start:auto}
}
@media (max-width:600px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  .sec{padding:64px 0}
  .steps,.plans,.idea-list,.prov,.qa,.gallery{grid-template-columns:minmax(0,1fr)}
  .hero{padding-top:44px}
  .hero{padding-bottom:56px}
  .hero .shot{margin-top:36px}
  .get{padding:24px}
  .get form{flex-direction:column}
  .feat+.feat{margin-top:64px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

/* ===== أقسام صفحات المنتجات ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nav .logo b{color:#fff;font-family:var(--f-display);font-size:22px}
.plans{grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}
.plan .pr s{font-size:22px;color:var(--muted);font-weight:500;margin-inline-end:6px}
.plan .pr.word{font-size:30px;margin-top:16px}
.get h2{font-size:clamp(24px,3vw,32px);margin-top:8px}
.get p{color:var(--muted);margin-top:10px}
.tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:56px;align-items:start}
.tools .sec-h{margin:0}
footer nav{display:flex;gap:18px;flex-wrap:wrap}
footer nav a{color:#CFE0E8;text-decoration:none}
footer nav a:hover{color:#fff}

/* المعاينة: الأقسام المخفية بإطار منقّط واسمها */
.pv-bar{background:#2D1B00;color:#FFE2A8;text-align:center;font-size:14px;padding:8px 16px}
[data-hidden]{position:relative;outline:3px dashed #E9B949;outline-offset:-10px}
[data-hidden]::before{content:"مخفي: " attr(data-hidden);position:absolute;top:14px;inset-inline-start:18px;z-index:5;background:#E9B949;color:#2D1B00;font-size:13px;font-weight:700;border-radius:999px;padding:3px 12px}

/* شريط العرض */
.offer-bar{background:linear-gradient(90deg,#F2A93B,#F7C46C);color:#2D1B00;font-size:15px;font-weight:600}
.offer-bar .wrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding-block:9px}
.offer-bar .cd{font-variant-numeric:tabular-nums;background:rgba(45,27,0,.1);border-radius:8px;padding:2px 10px;direction:ltr}
.offer-bar a{color:#2D1B00;font-weight:700}

/* المقارنة */
.compare{background:#fff;border-block:1px solid var(--line)}
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:#fff}
.cmp-wrap:focus-visible{outline:2px solid var(--river);outline-offset:2px}
.cmp{width:100%;border-collapse:separate;border-spacing:0;min-width:760px;font-size:15px}
.cmp th,.cmp td{padding:15px 14px;text-align:center;border-bottom:1px solid var(--line);vertical-align:middle}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp thead th{font-family:var(--f-display);font-weight:600;color:var(--ink);font-size:15px;background:var(--paper-2)}
.cmp tbody th{text-align:start;font-weight:600;color:var(--text);width:30%}
.cmp .me{background:var(--river-soft)}
.cmp thead .me{background:var(--ink);color:#fff;font-size:17px}
.cmp thead .me::after{content:"الأفضل";display:block;font-family:var(--f-body);font-size:12px;font-weight:600;color:var(--amber);margin-top:2px}
.cmp small{display:block;color:var(--muted);font-size:13px;line-height:1.5;margin-top:4px}
.cmp small.txt{color:var(--text);font-size:14px;margin:0}
.cmp .me small.txt{color:var(--ink);font-weight:600}
.cmp .yes,.cmp .no{display:inline-block;width:26px;height:26px;border-radius:50%}
.cmp .yes{background:var(--ok-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M8 13.5l3.4 3.4L18.5 9.8' fill='none' stroke='%231E7A4F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/26px no-repeat}
.cmp .no{background:#FBECEA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M9.5 9.5l7 7M16.5 9.5l-7 7' fill='none' stroke='%23B3261E' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center/26px no-repeat}
.closing{font-family:var(--f-display);font-weight:600;font-size:clamp(20px,2.4vw,26px);color:var(--ink);text-align:center;margin-top:34px;text-wrap:balance}

/* تجارب العملاء: أعمدة تحفظ طول كل صورة */
.masonry{columns:3 280px;column-gap:16px}
.masonry figure{break-inside:avoid;margin:0 0 16px;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.masonry .zoom{display:block;width:100%;border:0;padding:0;background:none;cursor:zoom-in}
.masonry img{width:100%}
.masonry figcaption{padding:12px 16px;display:grid;gap:2px}
.masonry figcaption b{font-family:var(--f-display);color:var(--ink);font-size:15px}
.masonry figcaption span{color:var(--muted);font-size:14px}
.empty{border:2px dashed var(--line);border-radius:16px;padding:40px;text-align:center;color:var(--muted)}

/* لوحة العرض */
.offer{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:center;background:var(--ink);color:#fff;border-radius:24px;padding:44px;position:relative;overflow:hidden}
.offer::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(242,169,59,.35),transparent 65%);inset-inline-end:-120px;top:-160px}
.offer>*{position:relative}
.offer-tag{display:inline-block;background:var(--amber);color:#2D1B00;font-weight:700;font-size:13px;border-radius:999px;padding:4px 14px}
.offer h2{color:#fff;font-size:clamp(26px,3.4vw,38px);margin-top:14px}
.offer p{color:#D5E4EB;margin-top:10px}
.offer .code{display:inline-flex;align-items:center;gap:12px;margin-top:20px;background:rgba(255,255,255,.08);border:1px dashed rgba(242,169,59,.7);border-radius:12px;padding:8px 16px 8px 8px}
.offer .code span{color:#AFC8D4;font-size:14px}
.offer .code b{font-family:Consolas,monospace;font-size:20px;letter-spacing:2px;color:var(--amber)}
.offer .copy{border:0;background:var(--amber);color:#2D1B00;font-weight:700;border-radius:8px;padding:6px 14px;cursor:pointer;font-family:var(--f-body)}
.offer-side{display:grid;gap:18px}
.timer{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.timer div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px 6px;text-align:center}
.timer b{display:block;font-family:var(--f-display);font-size:30px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;line-height:1.2}
.timer span{color:#AFC8D4;font-size:13px}

/* الضمان الذهبي */
.guar{display:grid;grid-template-columns:auto minmax(0,1fr);gap:48px;align-items:center;background:linear-gradient(135deg,#1A1406 0%,#2E2209 55%,#1A1406 100%);border-radius:28px;padding:48px;color:#F7EBCB;position:relative;overflow:hidden;box-shadow:0 30px 70px -30px rgba(120,80,0,.55)}
.guar::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 50%,rgba(233,185,73,.22),transparent 45%);pointer-events:none}
.guar>*{position:relative;z-index:1}
.seal{position:relative;width:220px;height:220px;filter:drop-shadow(0 18px 30px rgba(0,0,0,.45))}
.seal svg{width:100%;height:100%;animation:seal 40s linear infinite}
.seal-in{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#3A2600}
.seal-in b{font-family:var(--f-display);font-size:64px;font-weight:700;line-height:1}
.seal-in span{font-family:var(--f-display);font-weight:600;font-size:18px}
@keyframes seal{to{transform:rotate(360deg)}}
.gbadge{display:inline-block;background:linear-gradient(90deg,#FFE7A3,#E9B949);color:#3A2600;font-weight:700;font-size:14px;border-radius:999px;padding:4px 16px}
.guar h2{color:#FFE7A3;font-size:clamp(28px,3.6vw,42px);margin-top:14px}
.guar p{color:#E8DAB4;margin-top:12px;font-size:17px}
.ticks.gold li::before{background:rgba(233,185,73,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14 7.6' fill='none' stroke='%23E9B949' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.guar .ticks li{color:#F7EBCB}
.guar .btn{margin-top:26px}

/* تكبير الصور */
.lb{border:0;padding:0;background:transparent;max-width:min(92vw,900px);max-height:92vh}
.lb::backdrop{background:rgba(5,15,22,.85)}
.lb img{max-height:88vh;width:auto;border-radius:12px;margin:0 auto}
.lb-x{position:fixed;top:16px;inset-inline-end:16px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:26px;cursor:pointer}
[data-zoom]{cursor:zoom-in}

.swipe{display:none;color:var(--muted);font-size:14px;margin:0 0 10px}
@media (max-width:760px){
  .swipe{display:block}
  .cmp{min-width:640px;font-size:14px}
  .cmp tbody th,.cmp thead th:first-child{position:sticky;right:0;z-index:2;background:#fff;width:132px;min-width:132px;box-shadow:-6px 0 10px -8px rgba(11,58,82,.35)}
  .cmp thead th:first-child{background:var(--paper-2)}
  .cmp th,.cmp td{padding:12px 10px}
}
@media (max-width:980px){
  .tools,.offer,.guar{grid-template-columns:minmax(0,1fr)}
  .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guar{justify-items:center;text-align:center}
  .guar .ticks{text-align:start}
}
@media (max-width:600px){
  .plans{grid-template-columns:minmax(0,1fr)}
  .offer,.guar{padding:26px}
  .seal{width:170px;height:170px}
  .seal-in b{font-size:50px}
  .timer b{font-size:24px}
  .offer-bar .wrap{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.seal svg{animation:none}}

/* ===== الإصدار 1.1: مسافات أقل، وحركة مستمرة، وإنفوجرافيك ===== */
.sec{padding:64px 0}
.sec-h{margin-bottom:30px}
.feat+.feat{margin-top:64px}
.hero{padding:56px 0 64px}
.hero .shot{margin-top:40px}

/* البداية: أوتار تجري، وتوهج يتنفس، وشارات تطفو */
.hero .strings path.v{stroke-dasharray:18 12;animation:flowdash 3.5s linear infinite}
.hero .strings .s1{animation:sway 9s ease-in-out infinite}
.hero .strings .s2{animation:sway 11s ease-in-out infinite reverse}
.hero .strings .s3{stroke-dasharray:2 10;animation:flowdash 6s linear infinite reverse}
@keyframes flowdash{to{stroke-dashoffset:-60}}
@keyframes sway{50%{transform:translateY(6px)}}
.glow{position:absolute;border-radius:50%;filter:blur(60px);opacity:.35;pointer-events:none}
.glow.g1{width:420px;height:420px;background:#1C6E8C;top:-120px;inset-inline-start:-80px;animation:breathe 10s ease-in-out infinite}
.glow.g2{width:320px;height:320px;background:#F2A93B;bottom:-140px;inset-inline-end:10%;opacity:.18;animation:breathe 12s ease-in-out infinite reverse}
@keyframes breathe{50%{transform:scale(1.18) translate(20px,10px)}}
.hero-shot{position:relative}
.float{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);font-family:var(--f-display);font-weight:600;font-size:14px;border-radius:999px;padding:9px 16px;box-shadow:0 14px 34px -14px rgba(0,0,0,.45);white-space:nowrap;animation:bob 5s ease-in-out infinite}
.float i{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(30,122,79,.18);animation:blink 1.6s ease-in-out infinite}
.float.f1{top:22%;inset-inline-start:-18px}
.float.f2{top:58%;inset-inline-end:-22px;animation-delay:-1.2s}
.float.f3{bottom:-16px;inset-inline-start:22%;animation-delay:-2.4s}
.float.f4{top:-16px;inset-inline-end:18%;animation-delay:-3.6s}
.float.f2 i,.float.f4 i{background:var(--amber);box-shadow:0 0 0 4px rgba(242,169,59,.22)}
@keyframes bob{50%{transform:translateY(-10px)}}
@keyframes blink{50%{opacity:.35}}

/* لمعة تعبر الأزرار الرئيسية بلا توقف */
.btn.shine{position:relative;overflow:hidden}
.btn.shine::after{content:"";position:absolute;top:0;bottom:0;width:40%;inset-inline-start:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sweep 3.8s ease-in-out infinite}
@keyframes sweep{0%,55%{inset-inline-start:-60%}100%{inset-inline-start:130%}}

/* شريط الأرقام */
.stats-sec{background:var(--ink);position:relative;overflow:hidden;border-top:1px solid rgba(255,255,255,.08)}
.stats-sec::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(242,169,59,.12) 50%,transparent 70%);background-size:220% 100%;animation:pan 7s linear infinite}
@keyframes pan{from{background-position:120% 0}to{background-position:-120% 0}}
.stats{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;padding-block:30px}
.stat{text-align:center;color:#fff;padding:6px}
.stat b{display:flex;justify-content:center;align-items:baseline;gap:4px;font-family:var(--f-display);font-size:clamp(34px,4.4vw,48px);font-weight:700;line-height:1.1;color:#fff;font-variant-numeric:tabular-nums}
.stat b small{font-size:.5em;color:var(--amber)}
.stat>span{display:block;color:#AFC8D4;font-size:14.5px;margin-top:6px}

/* شريط المصادر المتحرك */
.marquee{overflow:hidden;margin-top:30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{display:flex;width:max-content;animation:marq 38s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee .lane{display:flex;gap:10px;padding-inline-end:10px}
@keyframes marq{to{transform:translateX(50%)}}

/* مسار العمل: نقاط مضيئة تجري على الخط */
.flow-sec{background:linear-gradient(180deg,#fff,var(--paper-2))}
.flow{position:relative;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:18px}
.rail{position:absolute;top:38px;inset-inline:calc(100% / var(--n,4) / 2);height:4px;border-radius:4px;background:linear-gradient(90deg,var(--river-soft),#CFE3EC,var(--river-soft));overflow:hidden}
.rail i{position:absolute;top:-3px;width:10px;height:10px;border-radius:50%;background:var(--amber);box-shadow:0 0 12px 3px rgba(242,169,59,.7);inset-inline-start:-10px;animation:run 4.8s linear infinite}
.rail i:nth-child(2){animation-delay:-1.2s}
.rail i:nth-child(3){animation-delay:-2.4s;background:var(--river);box-shadow:0 0 12px 3px rgba(28,110,140,.6)}
.rail i:nth-child(4){animation-delay:-3.6s}
@keyframes run{to{inset-inline-start:100%}}
.stage{position:relative;text-align:center;display:grid;justify-items:center;gap:8px}
.node{position:relative;width:80px;height:80px;border-radius:24px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink);box-shadow:0 18px 40px -22px rgba(11,58,82,.5)}
.node::before{content:"";position:absolute;inset:-7px;border-radius:30px;border:2px solid var(--amber);opacity:0;animation:ring 4.8s ease-out infinite;animation-delay:calc(var(--i) * 1.2s)}
@keyframes ring{0%{opacity:.9;transform:scale(.9)}35%,100%{opacity:0;transform:scale(1.12)}}
.node .ic{width:34px;height:34px}
.node em{position:absolute;top:-8px;inset-inline-end:-8px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-style:normal;font-family:var(--f-display);font-weight:700;font-size:13px;display:grid;place-items:center}
.stage b{font-family:var(--f-display);font-size:18px;color:var(--ink);margin-top:6px}
.stage p{color:var(--muted);font-size:15px;max-width:240px}

/* إنفوجرافيك الجودة */
.meters{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:24px;padding:36px}
.m-txt .sec-h{margin-bottom:22px}
.donut{position:relative;width:180px;height:180px}
.donut svg{width:100%;height:100%;transform:rotate(-90deg)}
.donut circle{fill:none;stroke-width:12}
.donut .bg{stroke:var(--river-soft)}
.donut .fg{stroke:url(#none);stroke:var(--ok);stroke-linecap:round;stroke-dasharray:var(--v) 100;animation:fillring 2.2s ease-out both}
@keyframes fillring{from{stroke-dasharray:0 100}}
.donut>div{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.donut b{font-family:var(--f-display);font-size:44px;font-weight:700;color:var(--ink);line-height:1}
.donut>div>span{color:var(--muted);font-size:13px;margin-top:4px}
.donut b span{font:inherit;color:inherit;margin:0}
.m-bars{display:grid;gap:16px}
.mrow{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.mrow b{font-family:var(--f-display);font-size:16px;color:var(--ink)}
.mrow em{font-style:normal;font-weight:700;color:var(--ok);font-variant-numeric:tabular-nums}
.mbar .track{height:10px;border-radius:10px;background:var(--paper-2);overflow:hidden;margin-top:6px;position:relative}
.mbar .track i{position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--v) * 1%);border-radius:10px;background:linear-gradient(90deg,var(--river),var(--ok));animation:grow 1.8s ease-out both;animation-delay:calc(var(--i) * .15s)}
.mbar .track i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);background-size:200% 100%;animation:pan 2.6s linear infinite}
@keyframes grow{from{width:0}}
.mbar small{display:block;color:var(--muted);font-size:13px;margin-top:4px}

/* لمعة تعبر عمود منتجك في المقارنة، ونبض للباقة المبرزة */
.cmp thead .me{position:relative;overflow:hidden}
.cmp thead .me::before{content:"";position:absolute;top:0;bottom:0;width:50%;inset-inline-start:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.25),transparent);animation:sweep 4.5s ease-in-out infinite}
.plan.hl{animation:halo 3.2s ease-in-out infinite}
@keyframes halo{50%{box-shadow:0 0 0 1px var(--ink),0 24px 60px -26px rgba(242,169,59,.75)}}

/* الدعم الفني */
.support{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px}
.sup-txt h2{font-size:clamp(24px,3vw,32px);margin-top:6px}
.sup-txt p{color:var(--muted);margin-top:8px}
.sup-txt small{display:block;color:var(--muted);font-size:14px;margin-top:10px}
.sup-ways{display:grid;gap:12px}
.way{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:var(--paper-2);text-decoration:none;color:var(--text)}
.way .ic{width:28px;height:28px;color:var(--river);flex:none}
.way span{display:grid;flex:1;min-width:0}
.way b{font-family:var(--f-display);color:var(--ink)}
.way em{font-style:normal;color:var(--muted);font-size:14px;overflow-wrap:anywhere;text-align:end}
.way.tg{background:var(--ink);border-color:var(--ink)}
.way.tg b{color:#fff}.way.tg em{color:#AFC8D4}.way.tg .ic{color:var(--amber)}
.way.tg:hover{background:#0E4867}
.way .copy{border:0;background:var(--ink);color:#fff;border-radius:8px;padding:6px 12px;font-family:var(--f-body);font-weight:600;cursor:pointer}
.support-sec.compact{padding-top:0}

/* التوثيق والتحديثات */
.nav nav a[aria-current]{color:#fff;font-weight:700}
.doc-hero{background:var(--ink);color:#fff;padding:48px 0 40px;position:relative;overflow:hidden}
.doc-hero::after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(242,169,59,.22),transparent 65%);inset-inline-end:-80px;top:-160px;animation:breathe 12s ease-in-out infinite}
.doc-hero .wrap{position:relative;z-index:1}
.doc-hero .kicker{color:var(--amber)}
.doc-hero h1{color:#fff;font-size:clamp(30px,4.4vw,46px);margin-top:8px}
.doc-hero p{color:#D5E4EB;max-width:760px;margin-top:12px;font-size:18px}
.doc-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:20px;color:#AFC8D4;font-size:14.5px}
.doc-meta b{color:#fff}
.doc-meta a{color:var(--amber)}
.doc{display:grid;grid-template-columns:250px minmax(0,1fr);gap:36px;align-items:start;padding-block:40px 56px}
.toc{position:sticky;top:84px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;max-height:calc(100vh - 110px);overflow:auto}
.toc b{font-family:var(--f-display);color:var(--ink)}
.toc ol{margin:10px 0 0;padding-inline-start:20px;display:grid;gap:6px;font-size:14.5px}
.toc a{color:var(--text);text-decoration:none}
.toc a:hover{color:var(--river)}
.doc-body section{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 28px;scroll-margin-top:84px}
.doc-body section+section{margin-top:14px}
.doc-body h2{display:flex;align-items:center;gap:12px;font-size:22px;margin-bottom:12px}
.doc-body h2 span{width:32px;height:32px;border-radius:10px;background:var(--river-soft);color:var(--river);display:grid;place-items:center;font-size:15px;flex:none}
.doc-body p{color:var(--text);margin-top:10px}
.doc-body .ticks{margin-top:12px}
.timeline{list-style:none;margin:0;padding:40px 0 56px;position:relative;display:grid;gap:18px}
.timeline::before{content:"";position:absolute;top:40px;bottom:56px;inset-inline-start:133px;width:2px;background:linear-gradient(var(--river),var(--line))}
.timeline>li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:28px;position:relative}
.timeline>li::before{content:"";position:absolute;top:22px;inset-inline-start:127px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--river)}
.timeline>li.latest::before{background:var(--amber);border-color:var(--amber);animation:blink 1.6s ease-in-out infinite}
.tl-when{display:grid;gap:2px;padding-top:14px;text-align:end;align-content:start}
.tl-when b{font-family:var(--f-display);font-size:22px;color:var(--ink)}
.tl-when time{color:var(--muted);font-size:13.5px}
.tl-when .new{justify-self:end;background:var(--amber-soft);color:#7A5200;font-size:12px;font-weight:700;border-radius:999px;padding:2px 10px;margin-top:4px}
.tl-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px 24px}
.tl-card h2{font-size:19px}
.tl-card .ticks{margin-top:10px}

@media (max-width:980px){
  .flow{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:30px}
  .rail{display:none}
  .meters,.support,.doc{grid-template-columns:minmax(0,1fr)}
  .toc{position:static;max-height:none}
  .float.f1{inset-inline-start:-6px}.float.f2{inset-inline-end:-6px}
}
@media (max-width:600px){
  .sec{padding:48px 0}
  .feat+.feat{margin-top:48px}
  .flow{grid-template-columns:minmax(0,1fr)}
  .meters,.support{padding:22px}
  .float{font-size:12.5px;padding:7px 12px}
  .float.f3,.float.f4{display:none}
  .timeline::before{inset-inline-start:8px}
  .timeline>li{grid-template-columns:minmax(0,1fr);gap:8px;padding-inline-start:30px}
  .timeline>li::before{inset-inline-start:2px;top:16px}
  .tl-when{text-align:start;display:flex;gap:10px;align-items:baseline;padding-top:8px}
  .doc-body section{padding:20px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important}
  .marquee .track{transform:none}
}

/* جوجل أدسنس */
.yield-sec{background:linear-gradient(180deg,var(--paper-2),#fff)}
.yld{display:grid;gap:34px}
.yld-txt{display:grid;gap:22px}
.yld-txt .sec-h{margin:0}
.yld-txt .ticks{margin:0;display:block;columns:2;column-gap:48px}
.yld-txt .ticks li{break-inside:avoid;margin-bottom:12px}
.yld-shot{max-width:1100px;width:100%;justify-self:center}
.yld-shot{margin:0}
.yld-frame{position:relative;border-radius:18px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 30px 70px -34px rgba(11,58,82,.55),0 0 0 6px rgba(66,133,244,.06);animation:floaty 7s ease-in-out infinite}
.yld-frame img{width:100%;cursor:zoom-in}
.yld-pulse{position:absolute;top:63.9%;left:92.9%;width:16px;height:16px;border-radius:50%;background:rgba(26,115,232,.25);transform:translate(-50%,-50%)}
.yld-pulse::before,.yld-pulse::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #1A73E8;animation:pulse 2.4s ease-out infinite}
.yld-pulse::after{animation-delay:1.2s}
@keyframes pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(3.2);opacity:0}}
@keyframes floaty{50%{transform:translateY(-8px)}}
.yld-shot figcaption{color:var(--muted);font-size:14px;margin-top:12px;text-align:center}

/* مقارنات أخرى */
.versus{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px}
.vs-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;display:grid;gap:4px;align-content:start}
.vs-card h3{font-size:20px;margin-bottom:10px}
.vs-head,.vs-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:center}
.vs-head{font-family:var(--f-display);font-weight:600;font-size:14px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.vs-head .old{grid-column:2;color:var(--muted)}
.vs-head .new{grid-column:3;color:#fff;background:var(--ink);border-radius:10px;padding:6px 10px;text-align:center;position:relative;overflow:hidden}
.vs-head .new::after{content:"";position:absolute;top:0;bottom:0;width:45%;inset-inline-start:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.3),transparent);animation:sweep 4.2s ease-in-out infinite}
.vs-row{padding:11px 0;border-bottom:1px solid #EEF3F6;font-size:14.5px}
.vs-row:last-child{border-bottom:0}
.vs-row b{font-family:var(--f-display);font-weight:600;color:var(--ink)}
.vs-row .old{color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.vs-row .old::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;background:#FBECEA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M6.5 6.5l5 5M11.5 6.5l-5 5' fill='none' stroke='%23B3261E' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/18px no-repeat}
.vs-row .new{color:var(--text);font-weight:600;display:flex;gap:8px;align-items:flex-start;background:var(--river-soft);border-radius:10px;padding:6px 8px}
.vs-row .new::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;background:var(--ok-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5.5 9.5l2.4 2.4L12.8 7' fill='none' stroke='%231E7A4F' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
@media (max-width:980px){.yld-txt .ticks{columns:1}}
@media (max-width:600px){
  .vs-head,.vs-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .vs-row b{grid-column:1/-1}
  .vs-head .old{grid-column:1}.vs-head .new{grid-column:2}
  .vs-card{padding:18px}
}
@media (prefers-reduced-motion:reduce){.yld-frame,.yld-pulse::before,.yld-pulse::after,.vs-head .new::after{animation:none}}

/* صفحات التوثيق والتحديثات في تصميم الباب (مِهَن) */
.d-bab{--ink:#1B3373;--ink-2:#14275A;--river:#23408E;--river-soft:#E4EAF8;--amber:#C9D6FA;--amber-soft:#E4EAF8;--paper-2:#F3F5FA;--line:#DCE2EE;--text:#101A36;--muted:#58648A;
  --f-display:"Readex Pro",Tahoma,sans-serif;--f-body:"Noto Naskh Arabic","Traditional Arabic",serif}
.d-bab .nav{background:rgba(27,51,115,.97)}
.d-bab .btn.pri{background:#fff;color:#1B3373}
.d-bab .btn.pri:hover{background:#E4EAF8}
.d-bab .doc-hero::after{background:radial-gradient(circle,rgba(201,214,250,.22),transparent 65%)}
.d-bab .way.tg:hover{background:#23408E}

/* صفحات التوثيق والتحديثات في تصاميم أثر وصدى وبرق */
.d-ink{--ink:#5E2531;--ink-2:#4A1C26;--river:#8C3B4A;--river-soft:#F4E7EA;--amber:#F2C9D0;--paper-2:#F6F5F4;--line:#E6E0E2;--text:#22161A;--muted:#6E6266;--f-display:"Markazi Text",Georgia,serif;--f-body:"Vazirmatn",Tahoma,sans-serif}
.d-ink .nav{background:rgba(94,37,49,.97)}
.d-ink .doc-hero h1{font-size:clamp(36px,5vw,54px)}
.d-night{--ink:#0A2129;--ink-2:#06161B;--river:#0E6E8C;--river-soft:#E1F3F8;--amber:#7FD3EA;--paper-2:#F2F7F9;--line:#D6E6EB;--text:#0B1F26;--muted:#4F6E78;--f-display:"El Messiri",Tahoma,sans-serif;--f-body:"Rubik",Tahoma,sans-serif}
.d-night .nav{background:rgba(6,22,27,.97)}
.d-studio{--ink:#0B6B4F;--ink-2:#08503B;--river:#0B6B4F;--river-soft:#E2F5EC;--amber:#F4C542;--paper-2:#F4F7F5;--line:#DDE6E1;--text:#0F1F19;--muted:#5A6B63;--f-display:"Almarai",Tahoma,sans-serif;--f-body:"Noto Sans Arabic",Tahoma,sans-serif}
.d-studio .nav{background:rgba(11,107,79,.97)}
.d-ink .btn.pri,.d-night .btn.pri{color:#1B1300}

.d-day{--ink:#0E6F73;--ink-2:#095053;--river:#0E6F73;--river-soft:#D9EDEB;--amber:#BFE6E3;--paper-2:#F2F6F5;--line:#D8E4E2;--text:#102A2E;--muted:#55706F;--f-display:"Cairo",Tahoma,sans-serif;--f-body:"Mada",Tahoma,sans-serif}
.d-day .nav{background:rgba(9,80,83,.97)}
.d-day .btn.pri{color:#04191C}

.d-gal{--ink:#2E1F6B;--ink-2:#1F1550;--river:#5B3FD1;--river-soft:#ECE8FB;--amber:#F2A93B;--paper-2:#F6F6F9;--line:#E3E1EA;--text:#16141D;--muted:#625F70;--f-display:"Rakkas",Georgia,serif;--f-body:"Tajawal",Tahoma,sans-serif}
.d-gal .nav{background:rgba(31,21,80,.97)}
.d-gal .doc-hero h1{font-weight:400}