:root{--bg-main:linear-gradient(171.16deg, #000 25.77%, #231708 77.42%, #be7b2d 175.75%);--text-gradient:linear-gradient(270deg, #be7b2c 0%, #f9c39d 100%);--text-light:#e0e0e2;--surface:#08060499;--border:#f9c39d59;--hero-ratio:1920 / 848;--mouse-x:50%;--mouse-y:50%}*{box-sizing:border-box}html{height:100%;margin:0}body{min-height:100dvh;color:var(--text-light);background:var(--bg-main);margin:0;font-family:Neue Montreal,Segoe UI,Tahoma,sans-serif}.page{background:0 0;flex-direction:column;align-items:center;min-height:100vh;padding:0 clamp(10px,1vw,16px) 8px;display:flex;position:relative;overflow:hidden}.mouse-aura{z-index:1;pointer-events:none;position:absolute;inset:0}.mouse-aura:before{content:"";left:var(--mouse-x);top:var(--mouse-y);filter:blur(10px);opacity:.5;background:radial-gradient(circle,#be7b2d33 0%,#be7b2d00 72%);width:clamp(180px,22vw,320px);height:clamp(180px,22vw,320px);transition:left .12s linear,top .12s linear;position:absolute;transform:translate(-50%,-50%)}.page:before{content:"";pointer-events:none;z-index:0;filter:blur(50px);background:radial-gradient(circle,#be7b2d1a 0%,#0000 70%);border-radius:50%;width:clamp(320px,45vw,640px);height:clamp(320px,45vw,640px);animation:14s ease-in-out infinite orbDrift;position:absolute;top:30%;left:65%;transform:translate(-50%,-50%)}.page:after{content:"";pointer-events:none;z-index:0;background:url(/Assets/backgreound/bg.png) bottom/100% no-repeat;width:min(2200px,118%);height:min(74vh,1307px);position:absolute;bottom:0;left:50%;transform:translate(-50%)}.top-nav{z-index:2;will-change:transform, opacity;justify-content:space-between;align-items:center;gap:24px;width:min(1726px,100%);margin:0 auto;padding:clamp(18px,2vw,28px) clamp(20px,2.2vw,42px) 0;animation:.8s cubic-bezier(.22,1,.36,1) both navIn;display:flex;position:relative}.logo-img{filter:drop-shadow(0 4px 4px #00000040);width:clamp(64px,4.2vw,81px);height:auto;animation:5s ease-in-out infinite softFloat,4s ease-in-out 1s infinite logoGlow}.nav-actions{align-items:center;gap:clamp(10px,1.5vw,28px);display:flex}.nav-actions .icon-btn:first-child{animation:.5s ease-out .35s both btnFadeIn}.nav-actions .icon-btn:nth-child(2){animation:.5s ease-out .5s both btnFadeIn}.icon-btn{cursor:pointer;z-index:3;touch-action:manipulation;background:0 0;border:0;flex:none;place-items:center;width:32px;height:32px;padding:0;transition:transform .18s,filter .18s,opacity .18s;display:grid;position:relative}.icon-btn img{object-fit:contain;pointer-events:none;width:auto;height:auto}.icon-theme img{width:27px;height:26px}.icon-search img{width:20px;height:20px}.icon-lang img{width:21px;height:21px}.icon-menu img{width:31px;height:22px}.icon-btn:hover{filter:drop-shadow(0 0 8px #f9c39d59);transform:translateY(-1px)scale(1.05)}.icon-btn:active{transform:scale(.95)}.hero{z-index:1;flex:1;justify-content:center;align-items:center;width:min(1726px,100%);margin:0 auto;padding:clamp(18px,2.4vh,28px) 0 0;display:flex;position:relative}.site-frame{width:min(1180px,77vw);max-width:1180px;aspect-ratio:var(--hero-ratio);will-change:transform, opacity;border-radius:0;margin:0 auto clamp(8px,2vh,24px);transition:transform .28s;animation:.95s cubic-bezier(.22,1,.36,1) both heroIn;position:relative;overflow:hidden}.lang-art{object-fit:contain;color:#0000;will-change:transform, opacity;width:100%;height:100%;animation:1.2s cubic-bezier(.22,1,.36,1) both artIn;display:block;position:absolute;inset:0}.lang-ar{display:none}.footer{z-index:2;will-change:transform, opacity;width:min(1726px,100%);margin:0 auto;padding:0;animation:.8s cubic-bezier(.22,1,.36,1) .25s both footerIn;position:relative}.footer-art{color:#0000;width:100%;max-width:1726px;height:auto;display:block}.footer-ar{display:none}.menu-drawer{border-left:1px solid var(--border);z-index:30;background:#0d0804;width:min(360px,80%);transition:transform .25s;position:fixed;inset:0 0 0 auto;transform:translate(100%)}.menu-drawer.open{transform:translate(0)}.drawer-content{flex-direction:column;gap:16px;padding:28px 22px;display:flex}.drawer-content h2,.drawer-content a,.close-menu{color:#fff;margin:0}.drawer-content a,.close-menu{text-align:start;cursor:pointer;background:0 0;border:0;padding:8px 0;font-size:1rem;text-decoration:none;transition:color .18s,transform .18s}.drawer-content a:hover,.close-menu:hover{color:#f9c39d;transform:translate(3px)}html[lang=ar] body{font-family:The Year of The Camel,Tahoma,sans-serif}html[lang=ar] .lang-en{display:none}html[lang=ar] .lang-ar{display:block}html[lang=ar] .footer-en{display:none}html[lang=ar] .footer-ar{display:block}html[lang=ar] .menu-drawer{border-left:0;border-right:1px solid var(--border);inset:0 auto 0 0;transform:translate(-100%)}html[lang=ar] .menu-drawer.open{transform:translate(0)}body.light{--bg-main:linear-gradient(171.16deg, #fff6de 25.77%, #231708 77.42%, #be7b2d 175.75%);--text-light:#2f2419;--surface:#ffffffb8;--border:#4e31124d}body.light .drawer-content h2,body.light .drawer-content a,body.light .close-menu{color:#2f2419}@media (max-width:920px){.top-nav{padding-inline:8px}.site-frame{width:min(980px,88vw)}}@media (max-width:700px){.logo-img{width:58px}.hero{padding-top:12px}.site-frame{width:94vw}}@keyframes navIn{0%{opacity:0;filter:blur(3px);transform:translateY(-10px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes heroIn{0%{opacity:0;filter:blur(5px);transform:translateY(16px)scale(.98)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}@keyframes artIn{0%{opacity:0;filter:blur(3px);transform:scale(1.05)}to{opacity:1;filter:blur();transform:scale(1)}}@keyframes footerIn{0%{opacity:0;filter:blur(3px);transform:translateY(10px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes softFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes logoGlow{0%,to{filter:drop-shadow(0 4px 4px #00000040)drop-shadow(0 0 #f9c39d00)}50%{filter:drop-shadow(0 4px 4px #00000040)drop-shadow(0 0 14px #f9c39d8c)}}@keyframes glowBreath{0%,to{box-shadow:0 0 #be7b2d00}50%{box-shadow:0 0 50px #be7b2d38,0 0 100px #be7b2d14}}@keyframes shimmer{0%{transform:translate(-120%)skew(-15deg)}to{transform:translate(250%)skew(-15deg)}}@keyframes orbDrift{0%,to{transform:translate(-50%,-50%)}33%{transform:translate(-62%,-42%)}66%{transform:translate(-38%,-60%)}}@keyframes btnFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
