@font-face{font-family:"Qatar2022";src:url("/fonts/qatar2022-majal-v2.woff2") format("woff2");font-weight:700;font-style:normal;font-display:block}
@font-face{font-family:"Outfit";src:url("/fonts/outfit.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{--blue:#0A87FC;--g1:#0A8EFC;--g2:#8550F9;--violet:#6F45F1;--navy:#0F172A;--ink:#E6ECF8;--muted:#94A3B8}
*{box-sizing:border-box;margin:0;padding:0}
html{height:100%;background:var(--navy);font-size:clamp(14px,calc(10px + .7vmin),30px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-height:100%;min-height:100svh;color:var(--ink);font-family:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(120% 90% at 50% 0%,#131d3a 0%,var(--navy) 60%) fixed,var(--navy);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.orb{position:absolute;border-radius:50%;filter:blur(calc(6vmax + 20px));opacity:.55;will-change:transform}
.orb-a{width:62vmax;height:62vmax;background:radial-gradient(circle,rgba(10,142,252,.75),rgba(10,142,252,0) 68%);top:-30vmax;right:-22vmax;animation:drift-a 22s ease-in-out infinite alternate}
.orb-b{width:58vmax;height:58vmax;background:radial-gradient(circle,rgba(133,80,249,.7),rgba(133,80,249,0) 68%);bottom:-30vmax;left:-22vmax;animation:drift-b 26s ease-in-out infinite alternate}
.orb-c{width:34vmax;height:34vmax;background:radial-gradient(circle,rgba(111,69,241,.45),rgba(111,69,241,0) 70%);top:50%;left:50%;margin:-17vmax 0 0 -17vmax;opacity:.5;animation:breathe 9s ease-in-out infinite}
.grid{position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.07) 1px,transparent 1px);background-size:calc(28px + 2.2vmin) calc(28px + 2.2vmin);background-position:center;-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 50%,#000 10%,transparent 75%);mask-image:radial-gradient(ellipse 60% 55% at 50% 50%,#000 10%,transparent 75%)}
.ring{position:absolute;top:50%;left:50%;width:min(88vmin,1100px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:conic-gradient(from 0deg,rgba(10,142,252,0) 0deg,rgba(10,142,252,.35) 70deg,rgba(133,80,249,.35) 140deg,rgba(133,80,249,0) 210deg,rgba(10,142,252,0) 360deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - 1px));opacity:.6;animation:spin 28s linear infinite}
.stage{position:relative;z-index:1;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:max(5vh,env(safe-area-inset-top)) max(6vw,env(safe-area-inset-right)) max(5vh,env(safe-area-inset-bottom)) max(6vw,env(safe-area-inset-left))}
.word{display:flex;flex-direction:column;align-items:center;font-weight:700;line-height:1}
.word .ar{font-family:"Qatar2022",serif;font-weight:700;font-size:clamp(84px,min(31vw,32vh),400px);line-height:1.32;padding:0 .12em;background:linear-gradient(100deg,var(--g1) 0%,var(--blue) 22%,var(--violet) 50%,var(--g2) 64%,var(--g1) 100%);background-size:220% 100%;background-position:0% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 .04em .16em rgba(10,135,252,.28));animation:rise 1.4s cubic-bezier(.2,.7,.2,1) both,sheen 9s ease-in-out 1.4s infinite alternate}
.word .en{font-family:"Outfit",sans-serif;font-weight:300;font-size:clamp(1rem,min(4.2vw,3.6vh),2.4rem);letter-spacing:.62em;margin-inline-start:.62em;text-transform:uppercase;color:rgba(230,236,248,.82);margin-top:clamp(.15rem,.9vh,.9rem);animation:rise 1.4s cubic-bezier(.2,.7,.2,1) .25s both}
.rule{display:block;width:clamp(48px,9vmin,140px);height:2px;border-radius:2px;margin:clamp(1.4rem,4.2vh,3.2rem) auto clamp(1.1rem,3vh,2.4rem);background:linear-gradient(90deg,var(--g1),var(--g2));opacity:.9;animation:grow 1.2s cubic-bezier(.2,.7,.2,1) .5s both}
.soon{display:flex;align-items:center;justify-content:center;gap:.6em;font-family:"Qatar2022",serif;font-weight:700;font-size:clamp(1.15rem,min(4.6vw,3.4vh),2.5rem);line-height:1.6;color:#F1F5FD;animation:rise 1.2s cubic-bezier(.2,.7,.2,1) .6s both}
.soon [lang=en]{font-family:"Outfit",sans-serif;font-weight:500}
.dot{flex:none;width:.42em;height:.42em;border-radius:50%;background:var(--blue);box-shadow:0 0 0 0 rgba(10,135,252,.6);animation:pulse 2.4s ease-out infinite}
.soon-en{font-family:"Outfit",sans-serif;font-weight:400;font-size:clamp(.8rem,min(3.2vw,2.2vh),1.5rem);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:.35em;animation:rise 1.2s cubic-bezier(.2,.7,.2,1) .72s both}
.badges{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(.7rem,2vmin,1.4rem);margin-top:clamp(1.6rem,4.6vh,3.6rem);animation:rise 1.2s cubic-bezier(.2,.7,.2,1) .9s both}
.badge{--h:clamp(46px,calc(34px + 2.4vmin),84px);display:inline-flex;align-items:center;gap:calc(var(--h)*.2);height:var(--h);min-width:calc(var(--h)*3.35);padding:0 calc(var(--h)*.32) 0 calc(var(--h)*.26);border-radius:calc(var(--h)*.2);background:#000;color:#fff;text-decoration:none;border:1px solid #A6A6A6;cursor:default;box-shadow:0 10px 30px -12px rgba(10,135,252,.35);transition:transform .3s,box-shadow .3s,border-color .3s}
.badge:hover{transform:translateY(-2px);border-color:#d0d4dc;box-shadow:0 14px 34px -12px rgba(133,80,249,.5)}
.mark{flex:none;width:calc(var(--h)*.54);height:calc(var(--h)*.54)}
.mark.play{width:calc(var(--h)*.48);height:calc(var(--h)*.48)}
.btxt{display:flex;flex-direction:column;align-items:flex-start;text-align:left;line-height:1.02;white-space:nowrap}
.btxt small{font-size:calc(var(--h)*.2);font-weight:400;letter-spacing:.01em}
.badge:nth-child(2) .btxt small{font-size:calc(var(--h)*.175);letter-spacing:.06em;font-weight:500}
.btxt b{font-size:calc(var(--h)*.385);font-weight:500;letter-spacing:-.01em;margin-top:.04em}
@keyframes rise{from{opacity:0;transform:translateY(18px);filter:blur(6px)}to{opacity:1;transform:none}}
.word .ar{animation-name:rise-ar,sheen}
@keyframes rise-ar{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
@keyframes grow{from{opacity:0;transform:scaleX(0)}to{opacity:.9;transform:scaleX(1)}}
@keyframes sheen{from{background-position:0% 50%}to{background-position:100% 50%}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(10,135,252,.55)}70%{box-shadow:0 0 0 .7em rgba(10,135,252,0)}100%{box-shadow:0 0 0 0 rgba(10,135,252,0)}}
@keyframes drift-a{to{transform:translate(-8vmax,7vmax) scale(1.08)}}
@keyframes drift-b{to{transform:translate(9vmax,-6vmax) scale(1.1)}}
@keyframes breathe{0%,100%{transform:scale(.9);opacity:.35}50%{transform:scale(1.08);opacity:.6}}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media (max-height:480px) and (orientation:landscape){.word .ar{font-size:min(30vh,22vw);line-height:1.25}.rule{margin:.8rem auto .6rem}.badges{margin-top:1rem}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.nt{text-transform:none}