:root{--bg:#090f1a;--panel:#1a2939;--green:#168f5b;--text:#fff;--muted:#adb7c2}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,"Noto Sans Arabic",sans-serif}a{text-decoration:none;color:inherit}
header{height:90px;background:var(--panel);display:flex;align-items:center;gap:32px;padding:0 4.5vw;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px}.brand img{width:52px;height:52px;border-radius:14px}.brand span{display:grid;line-height:.8}.brand b{font-size:27px}.brand small{font-size:9px;letter-spacing:.2em;color:#f8b52e;margin-top:10px;font-weight:900}nav{display:flex;height:100%;margin:auto}nav a{display:flex;align-items:center;padding:0 18px;font-weight:700;border-bottom:4px solid transparent}nav a:hover{background:#137d51;border-color:#39d78e}.tools{display:flex;gap:10px;align-items:center}.tools button{background:transparent;border:1px solid #6b7885;color:white;border-radius:5px;padding:10px;cursor:pointer}.download{min-height:48px;padding:0 20px;border-radius:5px;background:var(--green);display:inline-flex;align-items:center;justify-content:center;font-weight:900}.small{min-height:41px;font-size:13px}
.hero{height:min(56vw,590px);min-height:460px;position:relative;overflow:hidden;touch-action:pan-y}.hero-track{position:absolute;inset:0;display:flex;direction:ltr;transition:transform .55s cubic-bezier(.22,.61,.36,1)}.hero-slide{width:100%;min-width:100%;height:100%}.hero-slide img{width:100%;height:100%;object-fit:cover}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,14,23,.05) 15%,rgba(7,14,23,.68) 58%,#0a111c 91%)}[dir=ltr] .shade{background:linear-gradient(270deg,rgba(7,14,23,.05) 15%,rgba(7,14,23,.68) 58%,#0a111c 91%)}.hero-copy{position:absolute;inset:0 auto 0 0;width:52%;padding:6vw;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}[dir=rtl] .hero-copy{inset:0 0 0 auto}.hero-copy>span{color:#40d894;font-weight:900}.hero h1{font-size:clamp(42px,5vw,68px);line-height:1.05;margin:14px 0}.hero p{font-size:18px;line-height:1.8;color:#dce3e9;max-width:560px;margin:0 0 24px}.hero-dots{position:absolute;z-index:4;left:50%;bottom:23px;transform:translateX(-50%);display:flex;gap:9px;direction:ltr}.hero-dots button{width:13px;height:13px;border-radius:50%;border:0;padding:0;background:#84909c}.hero-dots button.current{background:#26bd78}
main section{padding:34px 4.4vw 8px}.title{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.title h2{font-size:29px;margin:0}.title>a{border:1px solid #647180;border-radius:4px;padding:8px 15px;font-size:14px}.rail{display:flex;gap:14px;overflow:auto;padding:2px 2px 18px;scroll-snap-type:x proximity}.channel{width:136px;min-width:136px;height:104px;border-radius:17px;border:1px solid #667381;background:var(--panel);display:grid;place-items:center;position:relative}.channel img{width:86%;height:70%;object-fit:contain}.channel i{position:absolute;right:10px;bottom:8px;width:7px;height:7px;border-radius:50%;background:#39d88f}.poster{width:282px;min-width:282px;aspect-ratio:3/4;border-radius:13px;overflow:hidden;position:relative}.poster img,.wide img{width:100%;height:100%;object-fit:cover}.poster span,.wide span{position:absolute;left:14px;bottom:14px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--green);font-size:12px}.wide{width:410px;min-width:410px;aspect-ratio:16/9;border-radius:13px;overflow:hidden;position:relative}
.app-panel{margin:22px 4.4vw 54px!important;padding:26px 30px!important;background:linear-gradient(115deg,#1c3044,#111b29);border:1px solid #425366;border-radius:12px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px}.app-panel img{width:82px;height:82px;border-radius:19px}.app-panel h2{margin:0 0 7px}.app-panel p{margin:0;color:var(--muted)}footer{background:var(--panel);padding:32px 5vw 44px;display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center}footer p{font-size:12px;color:var(--muted)}.mobile{display:none}
@media(max-width:800px){header{height:70px;padding:0 14px}.brand img{width:43px;height:43px}.brand b{font-size:21px}nav{display:none}.tools{margin-inline-start:auto}.tools .download{display:none}.hero{height:230px;min-height:0}.shade,[dir=ltr] .shade{background:linear-gradient(180deg,rgba(5,10,17,.05),rgba(7,14,23,.42) 72%,#090f1a)}.hero-copy,[dir=rtl] .hero-copy{inset:0;width:100%;padding:18px 18px 48px;justify-content:flex-start}.hero-copy>span,.hero-copy h1,.hero-copy p{display:none}.hero-copy .download{min-height:42px;font-size:13px}.hero-dots{bottom:18px}main section{padding:25px 12px 8px}.title{margin-bottom:12px}.title h2{font-size:23px}.rail{gap:8px;padding-bottom:12px}.channel{width:calc((100vw - 48px)/3.45);min-width:calc((100vw - 48px)/3.45);height:92px}.poster{width:calc((100vw - 44px)/3);min-width:calc((100vw - 44px)/3);border-radius:9px}.poster span{width:28px;height:28px;left:7px;bottom:7px;font-size:9px}.wide{width:66vw;min-width:66vw}.app-panel{margin:22px 12px 96px!important;padding:17px!important;grid-template-columns:auto 1fr}.app-panel img{width:58px;height:58px}.app-panel>.download{grid-column:1/-1}.mobile{display:block;position:fixed;z-index:40;bottom:10px;left:10px;right:10px;padding:7px;border:1px solid #405064;border-radius:10px;background:#07101eee}.mobile .download{width:100%}footer{grid-template-columns:1fr;padding-bottom:100px}}