
:root{--bg:#07101f;--panel:#0d1a2f;--panel2:#111f37;--line:#223656;--text:#f4f7fb;--muted:#aebad0;--blue:#2f7fd6;--blue2:#49a0ff;--gold:#ffb21a;--white:#fff;--shadow:0 20px 60px rgba(0,0,0,.28);--radius:22px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 0%,rgba(47,127,214,.18),transparent 28%),var(--bg);color:var(--text);font-family:Inter,Arial,"Noto Sans Arabic",sans-serif;line-height:1.7}body[dir=rtl]{font-family:"Noto Sans Arabic",Tahoma,Arial,sans-serif}.wrap{width:min(1180px,calc(100% - 36px));margin:auto}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}header{position:sticky;top:0;z-index:30;background:rgba(7,16,31,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}.nav{display:flex;align-items:center;gap:22px;min-height:74px}.brand{display:flex;align-items:center;min-width:158px}.brand img{width:150px;height:auto}.links{display:flex;gap:6px;align-items:center;flex:1;justify-content:center}.links a{padding:10px 12px;border-radius:12px;color:#d9e2ef;font-size:14px}.links a:hover,.links a.active{background:#132746;color:#fff}.lang{display:flex;gap:8px}.lang a{border:1px solid var(--line);padding:7px 10px;border-radius:10px;font-size:13px}.lang a.active{background:var(--blue);border-color:var(--blue)}.menuBtn{display:none;background:none;border:1px solid var(--line);color:white;border-radius:10px;padding:8px 10px}.hero{padding:72px 0 44px}.heroGrid{display:grid;grid-template-columns:1.04fr .96fr;gap:48px;align-items:center}.hero h1{font-size:clamp(38px,5vw,66px);line-height:1.08;margin:18px 0}.hero p{color:var(--muted);font-size:18px;max-width:680px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 20px;border-radius:12px;font-weight:700}.btn.primary{background:linear-gradient(135deg,var(--blue),var(--blue2));box-shadow:0 10px 28px rgba(47,127,214,.25)}.btn.secondary{border:1px solid var(--line);background:#0c192c}.heroMedia,.mediaCard{border-radius:var(--radius);overflow:hidden;border:1px solid #1f3558;background:#091425;box-shadow:var(--shadow)}.heroMedia img{width:100%;aspect-ratio:1.72;object-fit:cover}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}.stat{background:#0d1a2d;border:1px solid #1a2b47;border-radius:15px;padding:15px}.stat b{font-size:22px;display:block}.stat span{font-size:13px;color:var(--muted)}section{padding:56px 0}.sectionHead{max-width:760px;margin-bottom:26px}.sectionHead h2{font-size:clamp(28px,3vw,42px);line-height:1.2;margin:0 0 10px}.sectionHead p{color:var(--muted);margin:0}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.card{background:linear-gradient(180deg,#0e1d33,#0a1628);border:1px solid #1d3251;border-radius:18px;padding:22px}.card h3{margin:0 0 8px;font-size:21px}.card p,.card li{color:var(--muted)}.card ul{padding-inline-start:20px;margin:10px 0 0}.icon{width:42px;height:42px;border-radius:12px;background:#14345c;display:grid;place-items:center;font-weight:800;color:#6fb7ff;margin-bottom:14px}.split{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}.split .copy h2{font-size:38px;line-height:1.2;margin:0 0 14px}.split .copy p{color:var(--muted)}.checks{display:grid;gap:10px;margin-top:18px}.check{display:flex;gap:10px;align-items:flex-start}.check:before{content:'✓';color:var(--gold);font-weight:900}.phoneGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.phoneGrid img{width:100%;max-height:620px;object-fit:contain;background:#0b1628;border-radius:18px;border:1px solid #1d3150;padding:10px}.notice{background:linear-gradient(135deg,rgba(47,127,214,.16),rgba(255,178,26,.08));border:1px solid #284d79;border-radius:18px;padding:20px}.article{max-width:880px}.article h2{margin-top:34px;font-size:30px}.article h3{margin-top:25px}.article p,.article li{color:#c2ccdb}.article ul,.article ol{padding-inline-start:22px}.crumbs{font-size:13px;color:#8fa0b7;margin-top:22px}.pageHero{padding:52px 0 24px}.pageHero h1{font-size:clamp(36px,4vw,56px);line-height:1.15;margin:12px 0}.pageHero p{max-width:760px;color:var(--muted);font-size:17px}.footer{border-top:1px solid #1b2b44;margin-top:60px;padding:42px 0 20px;background:#060d18}.footerGrid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px}.footer img.logo{width:150px;margin-bottom:14px}.footer p,.footer a{color:#9eacc0;font-size:14px}.footerLinks{display:grid;gap:8px}.footer h4{margin:0 0 12px}.fine{border-top:1px solid #17243a;margin-top:28px;padding-top:18px;color:#77879c;font-size:12px}.tableWrap{overflow:auto;border:1px solid #20334e;border-radius:16px}.table{width:100%;border-collapse:collapse;min-width:600px}.table th,.table td{text-align:start;padding:14px 16px;border-bottom:1px solid #1c2b43}.table th{background:#0f1d31}.table td{color:#c0cbda}.ctaBand{display:flex;align-items:center;justify-content:space-between;gap:22px;background:#10223d;border:1px solid #23436d;border-radius:20px;padding:28px}.ctaBand h2{margin:0 0 6px}.ctaBand p{margin:0;color:var(--muted)}
@media(max-width:900px){.menuBtn{display:block}.links{display:none;position:absolute;top:74px;left:18px;right:18px;background:#0b1728;border:1px solid #20324f;border-radius:16px;padding:10px;flex-direction:column;align-items:stretch}.links.open{display:flex}.links a{text-align:center}.nav{justify-content:space-between}.heroGrid,.split,.grid2,.footerGrid{grid-template-columns:1fr}.grid3{grid-template-columns:1fr 1fr}.phoneGrid{grid-template-columns:1fr 1fr}.hero{padding-top:42px}.heroMedia{order:-1}.ctaBand{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.wrap{width:min(100% - 24px,1180px)}.brand{min-width:0}.brand img{width:126px}.lang a{padding:6px 8px}.grid3,.phoneGrid,.stats{grid-template-columns:1fr}.hero h1{font-size:40px}.sectionHead h2,.split .copy h2{font-size:30px}section{padding:40px 0}.pageHero{padding-top:36px}}


/* Content-density and media-balance update */
.richCopy{font-size:16px;color:#c2ccdb}.richCopy p{margin:0 0 16px}.richCopy h2{font-size:clamp(28px,3vw,40px);line-height:1.2;margin:0 0 16px;color:var(--text)}.richCopy h3{margin:24px 0 8px;color:var(--text)}.richCopy ul,.richCopy ol{padding-inline-start:22px;margin:12px 0 18px}.richCopy li{margin-bottom:8px}.balancedSplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.86fr);gap:40px;align-items:center}.balancedSplit.reverse{grid-template-columns:minmax(320px,.86fr) minmax(0,1fr)}.balancedSplit.reverse .verticalMedia{order:-1}.verticalMedia{display:flex;align-items:center;justify-content:center;min-height:0;padding:10px;background:#091425}.verticalMedia img{width:auto;max-width:100%;height:auto;max-height:min(62vh,620px);object-fit:contain;margin:auto}.phoneGrid img{max-height:min(62vh,620px);height:auto;object-fit:contain}.mediaCard.compact img{width:100%;max-height:min(56vh,520px);object-fit:contain;background:#091425}.imagePair{display:grid;grid-template-columns:1fr 1fr;gap:22px}.imagePair .mediaCard{display:flex;align-items:center;justify-content:center}.imagePair img{width:100%;max-height:min(54vh,500px);object-fit:contain}.editorial{max-width:980px}.editorial p,.editorial li{color:#c2ccdb}.editorial p{margin:0 0 16px}.editorial h2{font-size:clamp(27px,3vw,38px);line-height:1.25;margin:34px 0 14px}.editorial h3{font-size:22px;margin:25px 0 10px}.editorial ul,.editorial ol{padding-inline-start:24px}.textGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.textCard{background:linear-gradient(180deg,#0e1d33,#0a1628);border:1px solid #1d3251;border-radius:18px;padding:24px}.textCard h2,.textCard h3{margin-top:0}.textCard p,.textCard li{color:#c2ccdb}.textCard li{margin-bottom:7px}.leadCopy{font-size:18px;line-height:1.85;color:#c8d2e2;max-width:850px}.sectionTight{padding-top:28px}.heroText{max-width:720px}.heroText p{max-width:none}.pageHero .leadCopy{font-size:17px}.mediaCaption{font-size:12px;color:#8090a6;margin-top:8px;text-align:center}.contentNote{font-size:14px;color:#9aa9bd;border-inline-start:3px solid var(--blue);padding-inline-start:14px;margin-top:18px}
@media(max-width:900px){.balancedSplit,.balancedSplit.reverse,.imagePair,.textGrid{grid-template-columns:1fr}.balancedSplit.reverse .verticalMedia{order:0}.verticalMedia img,.phoneGrid img{max-height:72vh}.verticalMedia{max-width:620px;width:100%;margin:auto}.pageHero{padding-bottom:10px}}
@media(max-width:600px){.verticalMedia img,.phoneGrid img{max-height:70vh}.richCopy{font-size:15px}.leadCopy{font-size:16px}.textCard{padding:20px}}

/* Homepage visual content blocks and affiliate CTA spacing */
.home-visual-block .richCopy{align-self:center}
.home-visual-block .mediaCard{align-self:center}
.home-visual-block .mediaCard.compact img{width:100%;max-height:min(60vh,600px);object-fit:contain;background:#091425}
.home-visual-block .verticalMedia img{max-height:min(64vh,640px)}
.blockActions{margin-top:22px}
.play-now-band{padding-top:24px;padding-bottom:24px}
@media(max-width:900px){.home-visual-block .balancedSplit,.home-visual-block .balancedSplit.reverse{grid-template-columns:1fr}.home-visual-block .balancedSplit.reverse .verticalMedia{order:0}.ctaBand{align-items:flex-start;flex-direction:column}}

.sectionEndCta{display:flex;justify-content:flex-start;margin-top:28px}.sectionEndCta .btn{min-width:170px;text-align:center}html[dir="rtl"] .sectionEndCta{justify-content:flex-start}


/* Final CTA alignment: buttons stay inside the same content container as each block. */
.sectionContent > .sectionEndCta{margin-top:28px}
.editorial > .sectionEndCta{margin-top:28px}
section > .wrap > .sectionEndCta{margin-top:28px}
.ctaBand > .btn{flex:0 0 auto;min-width:170px}
@media(max-width:900px){.ctaBand > .btn{width:auto;align-self:flex-start}}

/* Mobile header alignment: keep the menu trigger on the outer edge, not between logo and language switcher. */
@media(max-width:900px){
  .nav{justify-content:flex-start;gap:10px}
  .brand{order:1;flex:0 0 auto}
  .lang{order:2;margin-inline-start:auto;flex:0 0 auto}
  .menuBtn{order:3;flex:0 0 auto;margin:0}
}

/* Mobile header hard fix: logo on the left; language switch and burger grouped on the right. */
@media (max-width:900px){
  .nav{
    direction:ltr !important;
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto auto !important;
    align-items:center !important;
    column-gap:8px !important;
    justify-content:stretch !important;
  }
  .nav > .brand{
    grid-column:1 !important;
    order:initial !important;
    margin:0 !important;
    justify-self:start !important;
  }
  .nav > .lang{
    grid-column:3 !important;
    order:initial !important;
    margin:0 !important;
    justify-self:end !important;
    direction:ltr !important;
  }
  .nav > .menuBtn{
    grid-column:4 !important;
    order:initial !important;
    margin:0 !important;
    justify-self:end !important;
  }
  .nav > .links{
    direction:ltr;
  }
  html[dir="rtl"] .nav > .links{
    direction:rtl;
  }
}


/* Mobile header final structure fix: language switch + menu are one physical group. */
.navTools{display:flex;align-items:center;gap:10px;margin-inline-start:auto;flex:0 0 auto}
@media (max-width:900px){
  .nav{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:12px !important;
    direction:ltr !important;
  }
  .nav > .brand{
    order:1 !important;
    margin:0 !important;
    flex:0 0 auto !important;
  }
  .nav > .links{
    order:3 !important;
  }
  .nav > .navTools{
    order:2 !important;
    margin-left:auto !important;
    margin-right:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    flex:0 0 auto !important;
    direction:ltr !important;
  }
  .navTools > .lang{margin:0 !important;display:flex !important;gap:6px !important;flex:0 0 auto !important}
  .navTools > .menuBtn{display:block !important;margin:0 !important;flex:0 0 auto !important;order:2 !important}
  .navTools > .lang{order:1 !important}
}
@media (max-width:480px){
  .nav{gap:8px !important}
  .brand img{width:122px !important;height:auto !important}
  .navTools{gap:6px !important}
  .lang a{padding:6px 8px !important}
  .menuBtn{padding:7px 9px !important}
}
