/* Platform look: night-sky aurora, frosted glass, glowing gradients. Loaded after platform.css and re-skins every platform page (front page, sign up, dashboard).
   Deep violet base, magenta + violet + cyan lights, a warm gold for prices and gifts. */
:root{--ink:#f5f2ff;--ink2:#bdb7dd;--paper:#0a0720;--white:rgba(255,255,255,.07);--sun:#ffc53d;--sun2:rgba(255,197,61,.14);--lag:#2ee6d6;--lag2:rgba(46,230,214,.12);--hib:#ff4d94;
 --vio:#8b6bff;--mag:#ff3d9a;--gold:#ffc53d;--line:rgba(255,255,255,.14);--glass:rgba(255,255,255,.07);--glass2:rgba(255,255,255,.12);--glow:0 24px 70px -24px rgba(139,107,255,.65);--sh:0 24px 70px -26px rgba(139,107,255,.6);--r:24px;--grad:linear-gradient(120deg,#ff3d9a,#8b6bff 55%,#2ee6d6)}
html{color-scheme:dark}
body{background:#0a0720;color:var(--ink);position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:-20%;z-index:-2;background:radial-gradient(40% 36% at 15% 12%,rgba(255,61,154,.38),transparent 70%),radial-gradient(38% 40% at 85% 20%,rgba(139,107,255,.45),transparent 70%),radial-gradient(44% 40% at 70% 90%,rgba(46,230,214,.26),transparent 70%),radial-gradient(34% 34% at 10% 85%,rgba(255,197,61,.16),transparent 70%);animation:aurora 22s ease-in-out infinite alternate}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;background:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1.4px) 0 0/46px 46px;-webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent);mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent)}
@keyframes aurora{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(3%,-2%,0) scale(1.08)}100%{transform:translate3d(-3%,3%,0) scale(1.03)}}
::selection{background:var(--mag);color:#fff}
:focus-visible{outline-color:var(--lag)}

/* header: a floating glass bar */
.top{top:12px;margin:12px max(14px,3vw) 0;border-radius:22px;border:1px solid var(--line);background:rgba(20,12,52,.55);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);box-shadow:0 14px 50px -20px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.12)}
.links a{color:var(--ink2)}.links a:hover{color:#fff;text-decoration:none;text-shadow:0 0 18px var(--mag)}
.logo{color:#fff}.mark{background:var(--grad);border:0;box-shadow:0 8px 24px -6px var(--mag)}.mark svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}
.acts a,.lnk{color:var(--ink)}

/* buttons: glowing gradient + glass */
.btn{border:0;color:#fff!important;background:var(--grad);background-size:160% 100%;border-radius:16px;box-shadow:0 12px 34px -10px rgba(255,61,154,.7),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s,box-shadow .25s,background-position .5s;position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 44px -10px rgba(255,61,154,.85),inset 0 1px 0 rgba(255,255,255,.4);background-position:100% 0}
.btn:hover::after{transform:translateX(120%)}.btn:active{transform:translateY(0);box-shadow:0 6px 20px -8px rgba(255,61,154,.7)}
.btn.sm{box-shadow:0 8px 22px -8px rgba(255,61,154,.7);border-radius:13px}.btn.big{box-shadow:0 16px 44px -12px rgba(255,61,154,.8);border-radius:18px;padding:17px 34px}
.btn.ghost{background:var(--glass);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(10px)}.btn.ghost:hover{background:var(--glass2)}
.acts .btn{color:#fff}

/* glass surfaces */
.box,.card,.plan,.svc,.domain-box,details,.matrix-wrap,.flash,.faq-list details,.gal figure .frame{background:var(--glass);border:1px solid var(--line);box-shadow:var(--glow),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4)}
.box,.card{border-radius:var(--r)}
.flash.error{background:rgba(255,77,148,.14);border-color:var(--hib);color:#ffd3e4}
.muted,.sub,.lead,.fine{color:var(--ink2)}
input,select,textarea{background:rgba(255,255,255,.06);border:1px solid var(--line);color:#fff;border-radius:14px;transition:border-color .2s,box-shadow .2s}
input::placeholder,textarea::placeholder{color:rgba(189,183,221,.6)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--lag);box-shadow:0 0 0 4px rgba(46,230,214,.18)}
select option{background:#150d38;color:#fff}
.form textarea,.form select{border:1px solid var(--line)}
.form label{color:var(--ink2)}
table th,table td{border-color:var(--line)}th{color:var(--ink2)}
.badge{background:var(--glass);border:1px solid var(--line);color:var(--ink)}.badge.ok{background:rgba(46,230,214,.16);color:#8ff5ea;border-color:rgba(46,230,214,.4)}.badge.bad{background:rgba(255,77,148,.16);color:#ffb4d0;border-color:rgba(255,77,148,.4)}

/* browser frames */
.frame{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:26px;box-shadow:0 40px 90px -30px rgba(139,107,255,.7),0 0 0 1px rgba(255,255,255,.04);backdrop-filter:blur(8px)}
.frame-bar{background:rgba(255,255,255,.07);border-bottom:1px solid var(--line)}
.frame-bar span{background:rgba(255,255,255,.08);border:0;color:var(--ink2)}
.frame-bar i{background:rgba(255,255,255,.3)}.frame-bar i:first-child{background:#ff5f7a}.frame-bar i:nth-child(2){background:var(--gold)}.frame-bar i:nth-child(3){background:#34e0a1}
.frame.sm{border-radius:18px;box-shadow:0 24px 50px -24px rgba(139,107,255,.7)}
.frame-view{background:#120a30}

/* hero */
.hero{position:relative}
.hero h1{font-size:clamp(38px,5.4vw,74px);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
.hero h1 em,.hl{font-style:normal;background:var(--grad);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 7s linear infinite}
@keyframes shimmer{to{background-position:200% 0}}
.promo{display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;padding:8px 16px 8px 8px;border-radius:999px;border:1px solid rgba(255,197,61,.45);background:linear-gradient(90deg,rgba(255,197,61,.18),rgba(255,61,154,.12));color:#ffe9b0;font-weight:600;font-size:15px;backdrop-filter:blur(10px)}
html[dir=rtl] .promo{padding:8px 8px 8px 16px}
.promo b{display:inline-grid;place-items:center;min-width:46px;height:30px;border-radius:999px;background:linear-gradient(120deg,var(--gold),#ff8a3d);color:#2a1300;font:800 15px/1 'Readex Pro',sans-serif;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,197,61,.55)}50%{box-shadow:0 0 0 10px rgba(255,197,61,0)}}
.hero-stage:before{inset:-8% -6% 4% -6%;background:conic-gradient(from 200deg,rgba(255,61,154,.55),rgba(139,107,255,.55),rgba(46,230,214,.45),rgba(255,61,154,.55));filter:blur(60px);border-radius:50%;transform:none;opacity:.7;animation:spin 26s linear infinite}
html[dir=rtl] .hero-stage:before{inset:-8% -6% 4% -6%;transform:none}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-stage .frame{animation:floaty 7s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-10px)}}
.chip{background:var(--glass);color:var(--ink);border:1px solid var(--line);backdrop-filter:blur(10px);transition:transform .2s,background .2s}.chip:hover{transform:translateY(-2px)}
.chip.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 8px 24px -8px var(--mag)}
.float-dash{border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 50px -16px rgba(46,230,214,.55);animation:floaty 6s ease-in-out -2s infinite}

/* stats */
.stats{max-width:1160px;margin:0 auto;padding:0 max(18px,4vw);display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.stat{padding:22px 20px;border-radius:22px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.stat b{display:block;font:800 clamp(30px,3.4vw,46px)/1.1 'Readex Pro',sans-serif;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{color:var(--ink2);font-size:15px}

/* sections */
.how,.plans,.themes,.domain{background:transparent;border:0}
.band h2{letter-spacing:-.01em;text-wrap:balance}
.band>h2{background:linear-gradient(180deg,#fff,#cfc8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.path b{background:var(--grad);color:#fff;border:0;box-shadow:0 10px 28px -8px var(--mag)}
.path li{padding:24px;border-radius:22px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(12px);transition:transform .3s,background .3s}
.path li:hover{transform:translateY(-6px);background:var(--glass2)}
.path li:not(:last-child):after{display:none}
.path p,.pane li,.svc p,details p{color:var(--ink2)}
.tab{background:var(--glass);color:var(--ink);border:1px solid var(--line);box-shadow:none;border-radius:999px;backdrop-filter:blur(10px)}
.tab.on{background:var(--grad);color:#fff;border-color:transparent;transform:none;box-shadow:0 10px 26px -8px var(--mag)}
.pane li:before{background:var(--lag);border:0;box-shadow:0 0 14px var(--lag);border-radius:50%;width:10px;height:10px;top:.7em}
.gal figcaption{background:rgba(255,255,255,.06);border-top:1px solid var(--line);color:var(--ink)}
.gal .frame{transition:transform .35s,box-shadow .35s}.gal .frame:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 40px 80px -24px rgba(255,61,154,.65)}
.domain-box{border-radius:30px}.addr-demo{background:rgba(255,255,255,.07);border:1px solid var(--line);color:#fff}.addr-demo .lock{color:var(--lag)}

/* stories */
.stories{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;max-width:1160px;margin:30px auto 0}
.story{position:relative;padding:28px 24px;border-radius:26px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(14px);overflow:hidden;transition:transform .3s}
.story:hover{transform:translateY(-6px) rotate(-.4deg)}
.story:before{content:"";position:absolute;inset:auto -30% -50% auto;width:220px;height:220px;border-radius:50%;background:var(--c1,var(--mag));filter:blur(70px);opacity:.35}
.story i{font-style:normal;font-size:38px;display:block;margin-bottom:10px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35))}
.story h3{font-size:21px;margin-bottom:8px}.story p{margin:0;color:var(--ink2);line-height:1.8;position:relative}

/* pricing */
.cycle{border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(12px)}
.cycle button{color:var(--ink)}.cycle button.on{background:var(--grad);color:#fff;box-shadow:0 8px 22px -8px var(--mag)}
.plan{background:var(--glass);border-radius:26px;transition:transform .35s,box-shadow .35s,border-color .35s;--mx:50%;--my:0%}
.plan:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(320px circle at var(--mx) var(--my),rgba(255,255,255,.16),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.plan:hover{transform:translateY(-8px);border-color:rgba(255,255,255,.3)}.plan:hover:before{opacity:1}
.plan:nth-child(2){background:var(--glass)}
.plan.feat{background:linear-gradient(160deg,rgba(255,61,154,.22),rgba(139,107,255,.22) 60%,rgba(46,230,214,.12));border-color:rgba(255,255,255,.35);box-shadow:0 30px 80px -24px rgba(255,61,154,.7),inset 0 1px 0 rgba(255,255,255,.25);transform:translateY(-10px)}
.plan.feat:hover{transform:translateY(-16px)}
.plan .tag{background:linear-gradient(120deg,var(--gold),#ff8a3d);color:#2a1300;box-shadow:0 8px 20px -6px rgba(255,138,61,.7)}
.plan .price{background:linear-gradient(180deg,#fff,#d9d2ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.plan .price small{-webkit-text-fill-color:var(--ink2);color:var(--ink2)}
.plan .was{display:block;font:500 15px/1.3 'Readex Pro',sans-serif;color:var(--ink2);text-decoration:line-through;text-decoration-color:var(--hib);text-decoration-thickness:2px;margin-top:6px;-webkit-text-fill-color:currentColor}
.plan .off{display:inline-block;margin-inline-start:8px;padding:2px 9px;border-radius:999px;background:linear-gradient(120deg,var(--gold),#ff8a3d);color:#2a1300;font:800 12px/1.6 'Readex Pro',sans-serif;text-decoration:none;vertical-align:middle;-webkit-text-fill-color:#2a1300}
.plan .gift{background:rgba(255,197,61,.12);border:1px dashed rgba(255,197,61,.6);color:#ffe9b0}
.plan.contact{border-style:dashed}
.ticks li::before{color:var(--lag)}
.matrix-wrap{border-radius:var(--r)}.matrix th,.matrix td{border-bottom:1px solid var(--line)}
.matrix thead th{background:rgba(255,255,255,.1);color:#fff}.matrix .y{color:var(--lag)}
.svc{border-radius:26px;transition:transform .3s}.svc:hover{transform:translateY(-6px)}

/* comparison + faq */
.ink{background:rgba(5,2,20,.55);color:var(--ink);border-block:1px solid var(--line)}
.bar-track{background:rgba(255,255,255,.1)}.bar-track span{background:linear-gradient(90deg,#6c6a8e,#8b88b0)}
.bar-row.mine .bar-track span{background:var(--grad);box-shadow:0 0 24px rgba(255,61,154,.6);animation:grow 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes grow{from{transform:scaleX(0);transform-origin:left}}
html[dir=rtl] .bar-row.mine .bar-track span{transform-origin:right}
.bar-row.mine .bar-name b{color:var(--gold)}.notes a{color:var(--lag)}
details{border-radius:18px;transition:background .2s}details[open]{background:var(--glass2)}
summary{color:#fff}summary:after{color:var(--lag)}

/* closing + footer */
.closing{position:relative;margin:30px max(14px,3vw);border-radius:36px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(255,61,154,.3),rgba(139,107,255,.3) 55%,rgba(46,230,214,.22));backdrop-filter:blur(16px);overflow:hidden;color:#fff}
.closing:before,.closing:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;filter:blur(80px);opacity:.5;pointer-events:none}
.closing:before{background:var(--mag);inset:-120px auto auto -80px}.closing:after{background:var(--lag);inset:auto -80px -140px auto}
.closing>*{position:relative}.closing h2{background:none;color:#fff;-webkit-text-fill-color:#fff}
.closing .btn{background:#fff;color:#2a0d57!important;box-shadow:0 18px 44px -12px rgba(255,255,255,.55)}
.foot{background:rgba(5,2,20,.6);border-top:1px solid var(--line);color:var(--ink2);backdrop-filter:blur(12px)}.foot .logo{color:#fff}

/* scroll reveal (only when script is on) */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}

/* building screen + inner pages stay readable on dark */
.build-stage .frame{background:var(--b-bg)}.bsteps li{color:var(--ink)}
.doc h2{color:#fff}

@media (max-width:1020px){.stats{grid-template-columns:repeat(2,1fr)}.top{margin-inline:10px}}
@media (max-width:640px){.stats{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:16px 10px}.closing{margin-inline:10px;border-radius:26px}.plan.feat{transform:none}.hero h1{font-size:clamp(32px,9vw,44px)}}
@media (prefers-reduced-motion:reduce){body::before,.hero-stage:before,.hero-stage .frame,.float-dash,.hl,.hero h1 em,.promo b,.bar-row.mine .bar-track span{animation:none!important}.js .rv{opacity:1;transform:none;transition:none}}
html{overflow-x:clip}
.promo b,.plan .off,.stat b{direction:ltr;unicode-bidi:isolate}
.form label.check{display:flex;align-items:flex-start}.check input{margin-top:5px;flex:none}

/* our work: the featured store with fanned screenshots, and a moving strip of fields */
.work .case{max-width:1160px;margin:34px auto 0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(20px,3vw,40px);border-radius:34px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(16px);box-shadow:var(--glow),inset 0 1px 0 rgba(255,255,255,.14)}
.case-pics{position:relative;display:block;aspect-ratio:1100/760;text-decoration:none;perspective:1200px}
.cp{position:absolute;width:78%;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.22);box-shadow:0 30px 60px -22px rgba(0,0,0,.75);transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s;background:#0b0720}
.cp img{width:100%;height:auto;display:block}
.cp1{inset-inline-start:0;top:12%;z-index:3}
.cp2{inset-inline-start:11%;top:4%;z-index:2;transform:scale(.94) rotate(3deg);opacity:.9}
.cp3{inset-inline-start:22%;top:-2%;z-index:1;transform:scale(.88) rotate(6deg);opacity:.75}
html[dir=rtl] .cp2{transform:scale(.94) rotate(-3deg)}html[dir=rtl] .cp3{transform:scale(.88) rotate(-6deg)}
.case-pics:hover .cp1{transform:translateY(-8px) scale(1.02);box-shadow:0 40px 80px -20px rgba(255,61,154,.6)}
.case-pics:hover .cp2{transform:translate(16px,-14px) scale(.96) rotate(5deg)}.case-pics:hover .cp3{transform:translate(34px,-22px) scale(.9) rotate(9deg)}
html[dir=rtl] .case-pics:hover .cp2{transform:translate(-16px,-14px) scale(.96) rotate(-5deg)}html[dir=rtl] .case-pics:hover .cp3{transform:translate(-34px,-22px) scale(.9) rotate(-9deg)}
.case-tag{display:inline-block;padding:5px 14px;border-radius:999px;background:linear-gradient(120deg,var(--gold),#ff8a3d);color:#2a1300;font:700 13px/1.6 'Readex Pro',sans-serif;margin-bottom:12px}
.case-text h3{font:800 clamp(34px,4.4vw,56px)/1.05 'Readex Pro',sans-serif;letter-spacing:.06em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px;direction:ltr;text-align:start}
.case-text p{color:var(--ink2);margin:0 0 16px}
.case-tags{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.case-tags li{padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.06);font-size:14px}
.next-wrap{max-width:1160px;margin:22px auto 0}
.next{display:grid;grid-template-columns:auto auto 1fr;gap:6px 16px;align-items:center;padding:22px 26px;border-radius:26px;border:1.5px dashed rgba(255,255,255,.35);background:linear-gradient(120deg,rgba(255,61,154,.1),rgba(46,230,214,.08));text-decoration:none;color:var(--ink);transition:transform .3s,border-color .3s,background .3s}
.next:hover{transform:translateY(-4px);border-color:var(--lag);background:linear-gradient(120deg,rgba(255,61,154,.18),rgba(46,230,214,.14))}
.next i{font-style:normal;font-size:30px;animation:twinkle 2.6s ease-in-out infinite}.next b{font:700 20px/1.3 'Readex Pro',sans-serif}.next span{color:var(--ink2)}
@keyframes twinkle{50%{transform:scale(1.25) rotate(14deg)}}
.ticker{max-width:1160px;margin:34px auto 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ticker-track{display:flex;gap:12px;width:max-content;animation:tick 70s linear infinite}
.ticker-track span{white-space:nowrap;padding:9px 18px;border-radius:999px;border:1px solid var(--line);background:var(--glass);color:var(--ink2);font-size:15px}
@keyframes tick{to{transform:translateX(-50%)}}
html[dir=rtl] .ticker-track{animation-name:tickr}@keyframes tickr{to{transform:translateX(50%)}}
@media (max-width:900px){.work .case{grid-template-columns:1fr}.next{grid-template-columns:auto 1fr}.next span{grid-column:1/-1}}
@media (prefers-reduced-motion:reduce){.ticker-track,.next i{animation:none!important}}

/* safety net: if the script that reveals sections ever fails, nothing stays hidden */
.js .rv:not(.in){animation:rvsafe .01s 2.5s forwards}
@keyframes rvsafe{to{opacity:1;transform:none}}

/* made in Egypt: a flag-colored pill, a rotating seal on the hero, a flag line under the header and in the footer */
.flag{display:inline-block;width:26px;height:18px;border-radius:4px;background:linear-gradient(180deg,#ce1126 0 33.3%,#fff 33.3% 66.6%,#000 66.6% 100%);box-shadow:0 0 0 1px rgba(255,255,255,.35),0 4px 12px -2px rgba(206,17,38,.6);vertical-align:middle;position:relative}
.flag::after{content:"";position:absolute;inset:6px auto 6px 50%;width:6px;transform:translateX(-50%);background:#c09300;border-radius:50% 50% 2px 2px;opacity:.9}
.egy-pill{display:inline-flex;align-items:center;gap:10px;margin:0 12px 14px 0;padding:7px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:linear-gradient(90deg,rgba(206,17,38,.28),rgba(255,255,255,.1) 50%,rgba(0,0,0,.35));backdrop-filter:blur(10px);font-weight:700;font-size:15px;color:#fff;box-shadow:0 10px 30px -14px rgba(206,17,38,.8)}
html[dir=rtl] .egy-pill{margin:0 0 14px 12px}
.hero-copy{position:relative}
.egy-seal{position:absolute;z-index:5;width:132px;height:132px;top:-44px;inset-inline-end:-18px;display:grid;place-items:center;border-radius:50%;background:rgba(10,7,32,.72);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);box-shadow:0 20px 50px -14px rgba(206,17,38,.75),inset 0 0 0 6px rgba(255,255,255,.04);transform:rotate(-8deg)}
.hero{position:relative}
.egy-seal svg{position:absolute;inset:0;width:100%;height:100%}
.egy-seal .ring{transform-origin:80px 80px;animation:spin 28s linear infinite}
.egy-seal text{font-family:'Readex Pro',sans-serif;font-weight:700;font-size:15px;fill:#fff;stroke:none}
.egy-seal .core{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%)}
.egy-seal .flag{width:40px;height:28px;border-radius:5px}
.egy-seal .flag::after{inset:9px auto 9px 50%;width:9px}
.top::after{content:"";position:absolute;inset:auto 22px -1px 22px;height:3px;border-radius:3px;background:linear-gradient(90deg,#ce1126 0 33.3%,#fff 33.3% 66.6%,#000 66.6% 100%);opacity:.9}
.top{position:sticky}
.foot-egy{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#fff}
@media (max-width:1020px){.egy-seal{width:104px;height:104px;top:-30px;inset-inline-end:-6px}.egy-seal text{font-size:15px}.egy-seal .core{width:44px;height:44px}.egy-seal .flag{width:32px;height:22px}}
@media (max-width:640px){.egy-seal{display:none}}
@media (prefers-reduced-motion:reduce){.egy-seal .ring{animation:none}}

/* what the others lack */
.vs-title{max-width:1160px;margin:46px auto 14px;font-size:clamp(22px,2.6vw,30px)}
.vs-wrap{max-width:1160px;margin:0 auto;overflow-x:auto;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.05);backdrop-filter:blur(14px)}
.vs{border-collapse:separate;border-spacing:0;width:100%;min-width:760px}
.vs th,.vs td{padding:14px 14px;text-align:center;border-bottom:1px solid var(--line);vertical-align:middle;font-size:15px}
.vs th:first-child,.vs td:first-child{text-align:start;min-width:260px;color:#fff}
.vs thead th{background:rgba(255,255,255,.08);color:#fff;font-weight:700}
.vs tbody tr:last-child td{border-bottom:0}
.vs .us{background:linear-gradient(180deg,rgba(255,61,154,.18),rgba(139,107,255,.14));border-inline:1px solid rgba(255,255,255,.2)}
.vs thead th.us{background:var(--grad);color:#fff}
.vy,.vn{display:inline-flex;flex-direction:column;align-items:center;gap:2px;font-weight:800;font-size:18px;line-height:1.2}
.vy{color:#34e0a1;text-shadow:0 0 14px rgba(52,224,161,.55)}.vn{color:#ff6b8b}
.vy small,.vn small{font-weight:500;font-size:12px;color:var(--ink2);text-shadow:none}
.vs-note{max-width:1160px;margin:14px auto 0;font-size:14px;color:var(--ink2)}