@font-face {
  font-family:Plex;
  src:url('../fonts/plex-arabic-400.woff2?v=387bc6099b8a') format('woff2'),url('../fonts/plex-arabic-400.ttf?v=837b6c630d02') format('truetype');
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:Plex;
  src:url('../fonts/plex-arabic-500.woff2?v=108fc3e8eea3') format('woff2'),url('../fonts/plex-arabic-500.ttf?v=f597d823c2fa') format('truetype');
  font-weight:500;
  font-display:swap;
}
@font-face {
  font-family:Plex;
  src:url('../fonts/plex-arabic-600.woff2?v=7a2729a59486') format('woff2'),url('../fonts/plex-arabic-600.ttf?v=f347060e509c') format('truetype');
  font-weight:600;
  font-display:swap;
}
@font-face {
  font-family:Plex;
  src:url('../fonts/plex-arabic-700.woff2?v=32d88baf2061') format('woff2'),url('../fonts/plex-arabic-700.ttf?v=b1191f964cb5') format('truetype');
  font-weight:700;
  font-display:swap;
}
:root {
  color-scheme:dark;
  --bg:#06090e;
  --surface:#0b111b;
  --line:#ffffff14;
  --text:#f4f7fc;
  --muted:#9aa6b6;
  --blue:#2478ff;
  --cyan:#24dfd0;
  --font:Plex,Tahoma,Arial,sans-serif;
  --max:1200px;
}
*,*:before,*:after {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:35px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font);
  font-size:16px;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
body.dialog-open {
  overflow:hidden;
}
a {
  color:inherit;
  text-decoration:none;
}
button,input {
  font:inherit;
}
button,a {
  -webkit-tap-highlight-color:transparent;
}
button {
  color:inherit;
  cursor:pointer;
  border:0;
}
img,video,svg {
  display:block;
  max-width:100%;
}
img {
  height:auto;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  text-wrap:balance;
}
p {
  text-wrap:pretty;
}
::selection {
  background:#2075e4;
  color:#fff;
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid var(--cyan);
  outline-offset:6px;
}
button:focus-visible {
  border-radius:12px;
}
[hidden] {
  display:none!important;
}
.container {
  width:min(var(--max),calc(100% - 80px));
  margin-inline:auto;
}
.section {
  padding-block:110px;
}
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:13px;
  color:#c5d2e2;
  font-size:14px;
  font-weight:500;
  margin-bottom:24px;
}
.section-number {
  color:#8cabc9;
  font-size:13px;
  font-family:Arial,sans-serif;
  border:1px solid #344358;
  border-radius:50%;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
}
.gradient-text {
  background:linear-gradient(105deg,#21ddcb 10%,#18b9ef 45%,#487cff 90%);
  background-clip:text;
  -webkit-background-clip:text;
  color:transparent;
}
.muted-text {
  color:#8191a5;
}
h2 {
  font-size:clamp(34px,4.2vw,55px);
  line-height:1.35;
  letter-spacing:-1.1px;
  font-weight:600;
}
h3 {
  font-weight:600;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  min-height:58px;
  padding:12px 30px;
  border-radius:10px;
  font-size:16px;
  font-weight:500;
  transition:background .2s,transform .2s,border-color .2s,box-shadow .2s;
  line-height:1.5;
}
.button-primary {
  background:linear-gradient(120deg,#1267ee,#347dff);
  border:1px solid #6facff55;
  box-shadow:inset 0 1px #a1c7ff50,0 6px 24px #006dff15;
  color:#fff;
}
.button-primary:hover {
  transform:translateY(-2px);
  box-shadow:inset 0 1px #a1c7ff50,0 8px 30px #006dff38;
}
.button-outline {
  border:1px solid #364253;
  background:#ffffff04;
}
.button-outline:hover {
  background:#ffffff09;
  border-color:#677c98;
}
.button-small {
  font-size:14px;
  min-height:44px;
  padding:8px 19px;
  gap:22px;
}
.button>span[aria-hidden] {
  font-size:22px;
}
.skip-link {
  position:fixed;
  top:-100px;
  right:20px;
  z-index:100;
  background:var(--cyan);
  color:#00151d;
  padding:12px 25px;
}
.skip-link:focus {
  top:15px;
}
/* Original transparent PNG, framed to its visible bounds without redrawing the wordmark. */
.brand {
  display:inline-flex;
  flex-shrink:0;
}
.logo-window {
  width:158px;
  aspect-ratio:1446/555;
  position:relative;
  overflow:hidden;
  display:block;
}
.logo-window img {
  max-width:none;
  position:absolute;
  width:118.05%;
  height:auto;
  left:-9.13%;
  top:-8.65%;
}
.site-header {
  height:94px;
  position:relative;
  z-index:20;
  border-bottom:1px solid var(--line);
  background:#06090eee;
}
.header-inner {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.desktop-nav {
  display:flex;
  align-items:center;
  gap:32px;
}
.desktop-nav a {
  color:#b3bdcb;
  font-size:14px;
  transition:color .2s;
}
.desktop-nav a:hover {
  color:white;
}
.header-actions {
  display:flex;
  align-items:center;
  gap:18px;
}
.menu-toggle {
  display:none;
  background:transparent;
  width:44px;
  height:44px;
  padding:11px;
}
.menu-toggle span {
  display:block;
  height:1.5px;
  background:#e5edfa;
  margin:6px 0;
  transition:transform .2s;
}
.menu-toggle[aria-expanded=true] span:first-child {
  transform:translateY(3.75px) rotate(45deg);
}
.menu-toggle[aria-expanded=true] span:last-child {
  transform:translateY(-3.75px) rotate(-45deg);
}
.mobile-nav {
  position:absolute;
  top:100%;
  inset-inline:0;
  background:#0b111bf5;
  backdrop-filter:blur(20px);
  padding:18px 30px 28px;
  border-bottom:1px solid #27384f;
}
.mobile-nav a {
  display:block;
  padding:10px 0;
  color:#d0d9e6;
  font-size:16px;
}
.hero {
  position:relative;
  padding-top:76px;
  isolation:isolate;
  overflow:hidden;
}
.hero-inner {
  text-align:center;
  position:relative;
  z-index:2;
}
.hero-halo {
  position:absolute;
  z-index:-2;
  inset:0 0 auto;
  height:980px;
  background:radial-gradient(ellipse 58% 50% at 50% 43%,#102c534a,transparent 82%);
  pointer-events:none;
}
.hero-grid {
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:linear-gradient(#4d91bf08 1px,transparent 1px),linear-gradient(90deg,#4d91bf08 1px,transparent 1px);
  background-size:90px 90px;
  mask-image:radial-gradient(ellipse 48% 37% at 50% 26%,#000 20%,transparent 95%);
  pointer-events:none;
}
.hero-eyebrow {
  font-size:14px;
  margin-bottom:26px;
  padding:5px 17px;
  border:1px solid #7d9fc12c;
  border-radius:30px;
  background:#ffffff03;
}
.tiny-spark {
  color:#4cc8ff;
}
.hero h1 {
  font-size:clamp(56px,6.4vw,87px);
  line-height:1.29;
  font-weight:700;
  letter-spacing:-2.1px;
}
.hero-description {
  max-width:750px;
  margin:27px auto 0;
  color:#9eabba;
  font-size:19px;
  line-height:1.9;
}
.hero-description strong {
  color:#dbe6f6;
  font-weight:500;
}
.hero-actions {
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:center;
  margin-top:33px;
}
.hero-actions .play-mini {
  font-family:Arial,sans-serif;
  font-size:12px;
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border:1px solid #8a99ad;
  border-radius:50%;
  padding-left:2px;
}
.hero-notes {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:25px;
  color:#8c9bb0;
  font-size:13px;
  margin-top:24px;
}
.hero-notes span+span:before {
  content:"";
  display:inline-block;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#486076;
  margin-inline-end:25px;
  vertical-align:middle;
}
.cinema-wrap {
  margin-top:68px;
}
.cinema {
  width:100%;
  height:545px;
  position:relative;
  isolation:isolate;
  text-align:initial;
  overflow:hidden;
  border:1px solid #668fba38;
  border-radius:19px;
  background:#0c1823;
  box-shadow:0 20px 100px #0006;
  display:block;
  padding:0;
}
.cinema-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 43%;
  transition:transform 1.2s cubic-bezier(.2,.6,.2,1);
}
.cinema:hover .cinema-image {
  transform:scale(1.035);
}
.cinema-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,#03070dea 0%,#030a0f25 50%,#03070d6e 100%),linear-gradient(90deg,#040b1570,#040b1515);
  pointer-events:none;
}
.cinema-top,.cinema-bottom {
  position:absolute;
  left:35px;
  right:35px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.cinema-top {
  top:28px;
  direction:ltr;
}
.mini-wordmark {
  font-family:Arial,sans-serif;
  letter-spacing:2.8px;
  font-size:13px;
  font-weight:600;
}
.mini-wordmark>span {
  font-size:12px;
  color:#bac9d7;
  letter-spacing:1.8px;
}
.cinema-tag {
  font-size:12px;
  border:1px solid #ffffff40;
  background:#03091255;
  border-radius:30px;
  padding:3px 14px;
  direction:rtl;
}
.cinema-center {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  text-align:center;
  gap:10px;
  padding:65px 25px;
}
.play-large {
  display:grid;
  place-items:center;
  width:76px;
  height:76px;
  border-radius:50%;
  border:1px solid #ffffff65;
  background:#e6f7ff13;
  backdrop-filter:blur(16px);
  font-family:Arial,sans-serif;
  font-size:22px;
  padding-left:4px;
  margin-bottom:16px;
  box-shadow:inset 0 0 20px #ffffff0a;
  transition:background .25s,transform .25s;
}
.cinema:hover .play-large {
  background:#2078ffd0;
  transform:scale(1.08);
}
.cinema-title {
  font-size:31px;
  font-weight:600;
  text-shadow:0 2px 22px #000;
}
.cinema-center .cinema-caption {
  font-size:14px;
  color:#c3d0dc;
}
.cinema-bottom {
  bottom:25px;
  font-size:14px;
  color:#b7c6d5;
}
.video-length {
  display:flex;
  align-items:center;
  gap:18px;
  color:#dce8f8;
  font-family:Arial,sans-serif;
  font-size:13px;
}
.video-length>span {
  font-size:22px;
}
.cinema-footnote {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:18px;
  font-size:13px;
  color:#8193a9;
}
.editorial-code {
  font:12px/1.4 Arial,sans-serif;
  letter-spacing:1.7px;
  color:#869ab4;
}
.cinema-footnote .editorial-code {
  font-size:12px;
}
.topics-strip {
  border-block:1px solid var(--line);
  margin-top:70px;
}
.topics-inner {
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:20px;
  padding-block:27px;
  color:#bec8d5;
  font-size:16px;
}
.topics-inner i {
  font-size:12px;
  color:#396484;
  font-style:normal;
}
.about-grid {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:120px;
}
.about-copy {
  padding-top:9px;
}
.about-copy .large-copy {
  font-size:25px;
  line-height:1.7;
  color:#d4dde9;
  margin-bottom:23px;
}
.large-copy>span {
  color:#2bbbf3;
}
.about-copy>p:not(.large-copy) {
  color:#93a2b6;
  font-size:17px;
  margin-bottom:20px;
  line-height:1.95;
}
.text-link {
  display:inline-flex;
  gap:35px;
  align-items:center;
  color:#c5defe;
  font-size:15px;
  font-weight:500;
  border-bottom:1px solid #39516d;
  padding-bottom:8px;
  margin-top:9px;
}
.text-link>span {
  color:#54acff;
  font-size:24px;
}
.learn-section {
  padding-top:0;
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:45px;
  margin-bottom:45px;
}
.section-heading>p {
  color:#8c9cb1;
  font-size:16px;
  line-height:1.85;
  padding-bottom:5px;
}
.learning-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.learning-card {
  position:relative;
  border:1px solid #7894bd24;
  border-radius:18px;
  overflow:hidden;
  background:linear-gradient(150deg,#0f1a29,#09111b 72%);
}
.intelligence {
  background:linear-gradient(150deg,#102526,#08131b 65%);
}
.card-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:25px 30px 0;
  color:#9badc4;
  font-size:13px;
}
.card-topline .editorial-code {
  font-size:12px;
}
.card-visual {
  height:215px;
  position:relative;
  margin:24px 25px 8px;
  overflow:hidden;
}
.chart-visual svg {
  width:100%;
  height:100%;
}
.visual-label {
  position:absolute;
  top:11px;
  right:14px;
  border:1px solid #4374a759;
  border-radius:5px;
  background:#0b1b2a;
  padding:4px 12px;
  font-size:12px;
  color:#b9d8ff;
}
.card-copy {
  padding:17px 31px 34px;
}
.card-kicker {
  color:#43a3fb;
  font-size:13px;
  display:block;
  margin-bottom:7px;
}
.intelligence .card-kicker {
  color:#42cfc2;
}
.card-copy h3 {
  font-size:29px;
  line-height:1.5;
  margin-bottom:12px;
}
.card-copy p {
  font-size:16px;
  line-height:1.85;
  color:#97a6ba;
  min-height:90px;
}
.card-tags {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:21px;
}
.card-tags>span {
  font-size:12px;
  color:#a7bad2;
  border:1px solid #7d9fc12e;
  border-radius:5px;
  padding:3px 11px;
  background:#ffffff02;
}
.ai-visual {
  padding:0 18px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.ai-request {
  align-self:flex-start;
  display:flex;
  align-items:center;
  gap:38px;
  padding:8px 15px;
  color:#b4ccd9;
  font-size:12px;
  border:1px solid #49666861;
  border-radius:9px;
  background:#132628;
  z-index:2;
  transform:translateX(-10px);
}
.ai-request-icon {
  width:20px;
  height:20px;
  border-radius:4px;
  background:#39afa742;
  color:#9feddd;
  display:grid;
  place-items:center;
}
.ai-response {
  width:88%;
  align-self:flex-end;
  border:1px solid #325d685e;
  background:linear-gradient(115deg,#10252e,#0b1b24);
  border-radius:12px;
  padding:18px 21px;
  transform:translateY(10px);
  box-shadow:0 12px 40px #0004;
}
.ai-response-title {
  display:flex;
  gap:12px;
  align-items:center;
  color:#c6e7e7;
  font-size:13px;
}
.ai-spark {
  color:#3ee2c8;
  font-size:25px;
}
.ai-line {
  display:block;
  height:5px;
  background:#52787832;
  border-radius:4px;
  margin-top:11px;
}
.line-1 {
  width:96%;
}
.line-2 {
  width:75%;
}
.line-3 {
  width:83%;
}
.ai-status {
  display:flex;
  gap:10px;
  margin-top:18px;
  font-size:12px;
  color:#86beba;
}
.ai-status span+span {
  border-right:1px solid #4685814f;
  padding-right:10px;
}
.section-note {
  font-size:12px;
  color:#8296b1;
  margin-top:20px;
}
.mindset-section {
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,#0a111a77,transparent);
}
.mindset-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:90px;
  direction:ltr;
}
.mindset-grid>* {
  direction:rtl;
}
.mindset-photo {
  position:relative;
  height:560px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid #809fc022;
}
.mindset-photo:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,#030b15e6,transparent 50%);
  pointer-events:none;
}
.mindset-photo>img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.photo-caption {
  position:absolute;
  bottom:25px;
  right:28px;
  left:28px;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:7px;
  font-size:15px;
}
.photo-caption .editorial-code {
  font-size:12px;
  color:#a4b8cd;
}
.mindset-copy h2 {
  font-size:clamp(34px,3.9vw,51px);
}
.mindset-copy>p {
  color:#91a3b9;
  font-size:17px;
  line-height:1.9;
  margin-top:25px;
}
.mindset-steps {
  list-style:none;
  padding:0;
  margin:28px 0 0;
}
.mindset-steps li {
  display:flex;
  align-items:flex-start;
  gap:20px;
  border-top:1px solid #ffffff0b;
  padding-top:16px;
  margin-top:16px;
}
.mindset-steps li>span {
  font:13px/2 Arial,sans-serif;
  color:#6c9bc3;
}
.mindset-steps h3 {
  font-size:16px;
  color:#ced9e8;
  font-weight:500;
}
.mindset-steps p {
  font-size:14px;
  color:#91a4bd;
  margin-top:2px;
}
.experience-section {
  padding-top:25px;
}
.download-section {
  padding-top:5px;
}
.download-panel {
  border:1px solid #4976ba47;
  border-radius:24px;
  background:#0b1625;
  position:relative;
  overflow:hidden;
  text-align:center;
  isolation:isolate;
  padding-block:72px 64px;
}
.download-pattern {
  position:absolute;
  inset:0;
  z-index:-1;
  background:radial-gradient(ellipse 65% 95% at 50% 115%,#1c5bde60,transparent 90%),linear-gradient(#578cfb0a 1px,transparent 1px),linear-gradient(90deg,#578cfb0a 1px,transparent 1px);
  background-size:auto,70px 70px,70px 70px;
  mask-image:linear-gradient(transparent 0%,black 55%);
}
.download-inner {
  padding:0 25px;
}
.download-panel .eyebrow {
  color:#b3ccec;
  margin-bottom:17px;
}
.download-panel h2 {
  font-size:clamp(58px,6.2vw,81px);
  line-height:1.18;
  font-weight:600;
}
.download-panel p {
  font-size:17px;
  color:#9eafc4;
  line-height:1.9;
  margin-top:23px;
}
.store-buttons {
  display:flex;
  gap:15px;
  align-items:center;
  justify-content:center;
  margin-top:31px;
  direction:ltr;
}
.store-button {
  background:#eff5ff;
  display:flex;
  align-items:center;
  gap:13px;
  min-width:214px;
  min-height:70px;
  border:1px solid #fff9;
  border-radius:10px;
  padding:9px 19px;
  color:#081326;
  transition:background .2s,transform .2s;
  text-align:left;
}
.store-button:hover {
  background:#fff;
  transform:translateY(-3px);
}
.store-button>svg {
  width:30px;
  height:35px;
}
.store-button>span:not(.store-arrow) {
  display:flex;
  flex-direction:column;
  gap:0;
}
.store-button small {
  font-size:12px;
  line-height:1.5;
  direction:rtl;
  text-align:left;
}
.store-button strong {
  font:600 21px/1.35 Arial,sans-serif;
  letter-spacing:-.4px;
}
.download-platforms {
  display:block;
  margin-top:25px;
  font:12px/1.5 Arial,sans-serif;
  letter-spacing:2px;
  color:#91b3dd;
}
.faq-section {
  padding-top:0;
}
.faq-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:90px;
}
.faq-grid h2 {
  font-size:44px;
}
.faq-lead {
  color:#8c9aad;
  margin-top:12px;
  font-size:17px;
}
.faq-list {
  border-top:1px solid #ffffff18;
}
.faq-list details {
  border-bottom:1px solid #ffffff18;
}
.faq-list summary {
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:21px 0;
  font-size:17px;
  cursor:pointer;
  color:#ced9e8;
}
.faq-list summary::-webkit-details-marker {
  display:none;
}
.faq-list summary>span {
  font:300 23px/1 Arial,sans-serif;
  color:#7c90ac;
  transition:transform .2s;
}
.faq-list details[open] summary>span {
  transform:rotate(45deg);
  color:#63b9f6;
}
.faq-answer {
  padding:0 0 22px;
  color:#9aabc2;
  font-size:16px;
  line-height:1.9;
}
.site-footer {
  border-top:1px solid #ffffff14;
  background:#04070c;
  padding-block:47px 25px;
}
.back-top {
  margin-inline-start:auto;
  font-size:14px;
  color:#a5b3c5;
  display:flex;
  align-items:center;
  gap:14px;
  min-height:44px;
}
.back-top>span {
  font-size:20px;
}
.footer-bottom {
  border-top:1px solid var(--line);
  padding-top:24px;
  display:flex;
  justify-content:space-between;
  gap:22px;
  color:#8fa2ba;
  font-size:12px;
}
.footer-bottom a:hover {
  color:#e3efff;
}
.risk-note {
  font-size:12px;
  color:#8293ab;
  margin-top:20px;
  line-height:1.8;
}
.mobile-only {
  display:none;
}
.store-dialog::backdrop {
  background:#01050cdd;
  backdrop-filter:blur(9px);
}
.dialog-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:14px 20px;
}
.dialog-top h2 {
  font-size:18px;
  letter-spacing:0;
}
.icon-button {
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid #677c9633;
  background:#ffffff05;
  font:28px/1 Arial,sans-serif;
}
.icon-button:hover {
  background:#ffffff15;
}
.dialog-caption {
  padding:16px 21px;
  color:#a4b5c9;
  font-size:14px;
}
.video-error {
  padding:18px 21px;
  font-size:15px;
  color:#e1c1ac;
}
.video-error a {
  text-decoration:underline;
  color:#8cc8ff;
}
.store-dialog {
  position:relative;
  width:min(440px,calc(100% - 40px));
  padding:45px 28px 34px;
  text-align:center;
  border-radius:20px;
  background:#0d1929;
  border:1px solid #45608a;
  color:var(--text);
}
.store-dialog h2 {
  font-size:28px;
  letter-spacing:0;
}
.store-dialog p {
  margin:15px 0 25px;
  font-size:16px;
  color:#a9bbd1;
}
.store-close {
  position:absolute;
  top:12px;
  left:12px;
}
.dialog-spark {
  display:grid;
  place-items:center;
  width:57px;
  height:57px;
  border:1px solid #559eff54;
  background:#1876ff14;
  border-radius:17px;
  font-size:31px;
  color:#6bb3ff;
  margin:0 auto 22px;
}
.noscript-note {
  position:relative;
  text-align:center;
  padding:15px;
  background:#172d45;
  font-size:14px;
}
.noscript-note a {
  text-decoration:underline;
}
/* Supporting pages. */
.document-main {
  padding:85px 0 110px;
  min-height:68vh;
}
.document-container {
  width:min(800px,calc(100% - 56px));
  margin:auto;
}
.document-main h1 {
  font-size:clamp(38px,5vw,62px);
  line-height:1.35;
  margin:15px 0 22px;
}
.document-main h2 {
  font-size:25px;
  letter-spacing:0;
  margin:35px 0 13px;
}
.document-main p,.document-main li {
  color:#9aacc3;
  font-size:17px;
  line-height:1.95;
}
.document-main p+p {
  margin-top:15px;
}
.document-main ul {
  padding-inline-start:24px;
}
.document-main a {
  color:#70b5ff;
  text-decoration:underline;
  text-underline-offset:4px;
}
.document-main .button {
  color:white;
  text-decoration:none;
}
.document-note {
  padding:20px 24px;
  border:1px solid #36506d;
  border-radius:10px;
  background:#112239;
  margin-bottom:35px;
}
.document-note p {
  font-size:15px;
  color:#b7cde4;
}
.error-number {
  font:500 clamp(100px,20vw,220px)/1 Arial,sans-serif;
  letter-spacing:-12px;
  color:#162d4d;
  text-align:center;
}
.error-page {
  text-align:center;
}
.error-page p {
  max-width:510px;
  margin:0 auto 30px;
}
.error-page .button {
  display:inline-flex;
}
@media(min-width:1600px) {
  .hero {
    padding-top:96px;
  }
  .hero h1 {
    font-size:94px;
  }
}
@media(max-width:1100px) {
  .container {
    width:calc(100% - 56px);
  }
  .desktop-nav {
    gap:20px;
  }
  .logo-window {
    width:138px;
  }
  .header-inner {
    gap:20px;
  }
  .section {
    padding-block:85px;
  }
  .hero {
    padding-top:65px;
  }
  .hero h1 {
    font-size:72px;
  }
  .cinema {
    height:480px;
  }
  .about-grid {
    gap:65px;
  }
  .mindset-grid {
    gap:50px;
  }
  .mindset-photo {
    height:510px;
  }
  .faq-grid {
    gap:55px;
  }
  .learn-section {
    padding-top:0;
  }
  .experience-section {
    padding-top:15px;
  }
  .download-section,.faq-section {
    padding-top:0;
  }
  .card-copy {
    padding-inline:25px;
  }
  .card-copy h3 {
    font-size:26px;
  }
  .card-copy p {
    min-height:120px;
  }
  .card-topline {
    padding-inline:25px;
  }
  .ai-visual {
    padding-inline:0;
  }
  .mini-wordmark>span {
    display:none;
  }
}
@media(max-width:800px) {
  .site-header {
    height:80px;
  }
  .desktop-nav {
    display:none;
  }
  .menu-toggle {
    display:block;
  }
  .header-actions {
    gap:10px;
  }
  .logo-window {
    width:132px;
  }
  .hero {
    padding-top:53px;
  }
  .hero h1 {
    font-size:60px;
  }
  .hero-description {
    font-size:17px;
  }
  .hero-actions .button {
    min-height:54px;
    padding-inline:22px;
    font-size:15px;
  }
  .hero-notes {
    gap:14px;
    font-size:12px;
  }
  .hero-notes span+span:before {
    margin-inline-end:14px;
  }
  .cinema-wrap {
    margin-top:50px;
  }
  .cinema {
    height:390px;
  }
  .cinema-top,.cinema-bottom {
    right:24px;
    left:24px;
  }
  .cinema-title {
    font-size:27px;
  }
  .cinema-footnote .editorial-code {
    display:none;
  }
  .topics-inner {
    font-size:14px;
    padding-block:22px;
    gap:12px;
  }
  .topics-strip {
    margin-top:45px;
  }
  .about-grid {
    gap:35px;
    grid-template-columns:1fr 1.15fr;
  }
  .about-copy .large-copy {
    font-size:22px;
  }
  .about-copy>p:not(.large-copy) {
    font-size:16px;
  }
  .section-heading {
    gap:25px;
  }
  .section-heading>p {
    font-size:16px;
  }
  .learning-grid {
    gap:18px;
  }
  .card-topline {
    padding:22px 20px 0;
  }
  .card-topline .editorial-code {
    display:none;
  }
  .card-copy {
    padding:10px 20px 26px;
  }
  .card-copy h3 {
    font-size:23px;
  }
  .card-copy p {
    font-size:16px;
    min-height:144px;
  }
  .card-visual {
    height:180px;
    margin:20px 14px 10px;
  }
  .ai-request {
    font-size:12px;
    gap:20px;
    padding:7px 10px;
  }
  .ai-response {
    padding:12px 14px;
    width:94%;
  }
  .ai-response-title {
    font-size:12px;
    gap:8px;
  }
  .ai-line {
    height:4px;
    margin-top:8px;
  }
  .ai-status {
    margin-top:12px;
    gap:8px;
  }
  .ai-status span+span {
    padding-right:8px;
  }
  .card-tags>span {
    padding:3px 8px;
  }
  .mindset-grid {
    grid-template-columns:1fr 1.1fr;
    gap:33px;
  }
  .mindset-photo {
    height:490px;
  }
  .mindset-copy>p {
    font-size:16px;
  }
  .mindset-copy h2 {
    font-size:34px;
  }
  .mindset-steps h3 {
    font-size:16px;
  }
  .mindset-steps li {
    gap:14px;
  }
  .photo-caption {
    right:19px;
    left:19px;
    font-size:14px;
  }
  .photo-caption .editorial-code {
    display:none;
  }
  .faq-grid {
    grid-template-columns:1fr;
    gap:30px;
  }
  .faq-grid h2 {
    font-size:37px;
  }
  .faq-lead {
    display:none;
  }
  .faq-list summary {
    font-size:16px;
  }
  .download-panel h2 {
    font-size:64px;
  }
  .section {
    padding-block:72px;
  }
  .learn-section,.experience-section,.download-section,.faq-section {
    padding-top:0;
  }
      .footer-bottom {
    gap:18px;
  }
    .document-main {
    padding-block:60px 80px;
  }
}
@media(max-width:560px) {
  .container {
    width:calc(100% - 38px);
  }
  html {
    scroll-padding-top:24px;
  }
  .site-header {
    height:76px;
  }
  .logo-window {
    width:119px;
  }
  .header-actions>.button {
    font-size:14px;
    min-height:44px;
    padding:8px 13px;
    gap:12px;
  }
  .header-actions>.button>span {
    font-size:17px;
  }
  .header-actions {
    gap:4px;
  }
  .header-inner {
    gap:10px;
  }
  .menu-toggle {
    width:40px;
    padding:9px;
  }
  .hero {
    padding-top:44px;
  }
  .hero-eyebrow {
    font-size:12px;
    padding:4px 14px;
    gap:9px;
    margin-bottom:23px;
  }
  .hero h1 {
    font-size:clamp(38px,10.25vw,57px);
    line-height:1.36;
    letter-spacing:-1px;
  }
  .hero-description {
    font-size:16px;
    line-height:1.9;
    margin-top:21px;
    padding-inline:7px;
  }
  .desktop-only {
    display:none;
  }
  .mobile-only {
    display:initial;
  }
  .hero-actions {
    margin-top:27px;
    gap:10px;
    flex-direction:column;
  }
  .hero-actions .button {
    width:min(330px,100%);
    min-height:53px;
    font-size:15px;
  }
  .hero-actions .button-outline {
    border:0;
    background:transparent;
    min-height:44px;
    padding:5px 15px;
    color:#a7bbd5;
    font-size:14px;
    gap:12px;
  }
  .hero-notes {
    margin-top:19px;
    flex-wrap:wrap;
    gap:4px 13px;
    font-size:12px;
    padding-inline:5px;
  }
  .hero-notes span+span:before {
    margin-inline-end:13px;
  }
  .cinema-wrap {
    margin-top:35px;
  }
  .cinema {
    height:auto;
    aspect-ratio:1.28;
    border-radius:12px;
  }
  .cinema-top {
    top:16px;
    left:17px;
    right:17px;
  }
  .mini-wordmark {
    font-size:12px;
    letter-spacing:1.8px;
  }
  .cinema-tag {
    font-size:12px;
    padding:2px 10px;
  }
  .cinema-center {
    padding:50px 15px;
    gap:6px;
  }
  .play-large {
    width:58px;
    height:58px;
    font-size:18px;
    margin-bottom:9px;
  }
  .cinema-title {
    font-size:21px;
  }
  .cinema-center .cinema-caption {
    font-size:12px;
  }
  .cinema-bottom {
    bottom:14px;
    right:18px;
    left:18px;
    font-size:12px;
  }
  .video-length {
    font-size:12px;
    gap:9px;
  }
  .video-length>span {
    font-size:18px;
  }
  .cinema-footnote {
    font-size:12px;
    margin-top:12px;
  }
  .topics-strip {
    margin-top:33px;
  }
  .topics-inner {
    display:grid;
    grid-template-columns:1fr 1fr;
    text-align:center;
    row-gap:11px;
    padding-block:20px;
    font-size:14px;
  }
  .topics-inner i {
    display:none;
  }
  .topics-inner>span:nth-of-type(even) {
    border-right:1px solid #ffffff1c;
  }
  .section {
    padding-block:61px;
  }
  h2 {
    font-size:34px;
    line-height:1.4;
    letter-spacing:-.5px;
  }
  .eyebrow {
    font-size:14px;
    margin-bottom:18px;
    gap:10px;
  }
  .section-number {
    font-size:12px;
    width:24px;
    height:24px;
  }
  .about-grid {
    grid-template-columns:1fr;
    gap:28px;
  }
  .about-copy {
    padding-top:0;
  }
  .about-copy .large-copy {
    font-size:22px;
    margin-bottom:18px;
  }
  .about-copy>p:not(.large-copy) {
    font-size:16px;
    margin-bottom:15px;
  }
  .text-link {
    font-size:14px;
    gap:24px;
  }
  .learn-section {
    padding-top:0;
  }
  .section-heading {
    display:block;
    margin-bottom:30px;
  }
  .section-heading>p {
    font-size:16px;
    margin-top:20px;
  }
  .section-heading>p>br {
    display:none;
  }
  .learning-grid {
    grid-template-columns:1fr;
    gap:20px;
  }
  .card-topline {
    padding:23px 23px 0;
    font-size:12px;
  }
  .card-topline .editorial-code {
    display:inline;
    font-size:12px;
    letter-spacing:.7px;
  }
  .card-visual {
    height:210px;
    margin:20px 18px 10px;
  }
  .card-copy {
    padding:9px 24px 28px;
  }
  .card-copy h3 {
    font-size:28px;
  }
  .card-copy p {
    min-height:0;
    font-size:16px;
  }
  .card-tags {
    gap:7px;
    margin-top:20px;
  }
  .card-tags>span {
    font-size:12px;
    padding:3px 9px;
  }
  .card-kicker {
    font-size:13px;
  }
  .ai-visual {
    padding-inline:13px;
  }
  .ai-request {
    font-size:12px;
    padding:7px 12px;
    gap:30px;
  }
  .ai-response {
    padding:15px 17px;
    width:87%;
  }
  .ai-response-title {
    font-size:12px;
    gap:11px;
  }
  .ai-line {
    height:4px;
    margin-top:10px;
  }
  .ai-status {
    font-size:12px;
    margin-top:15px;
  }
  .section-note {
    font-size:12px;
    margin-top:16px;
  }
  .mindset-grid {
    display:flex;
    flex-direction:column-reverse;
    gap:32px;
    align-items:stretch;
  }
  .mindset-copy h2 {
    font-size:37px;
  }
  .mindset-copy>p {
    font-size:16px;
    margin-top:18px;
  }
  .mindset-steps {
    margin-top:22px;
  }
  .mindset-steps li {
    padding-top:15px;
    margin-top:15px;
    gap:19px;
  }
  .mindset-steps h3 {
    font-size:16px;
  }
  .mindset-steps p {
    font-size:14px;
  }
  .mindset-photo {
    height:340px;
    border-radius:12px;
  }
  .mindset-photo>img {
    object-position:50% 60%;
  }
  .photo-caption {
    font-size:14px;
    bottom:19px;
  }
  .photo-caption .editorial-code {
    display:inline;
    font-size:12px;
    letter-spacing:1px;
  }
  .experience-section {
    padding-top:0;
  }
  .download-section {
    padding-top:0;
  }
  .download-panel {
    border-radius:17px;
    padding-block:45px 38px;
  }
  .download-inner {
    padding:0 19px;
  }
  .download-panel h2 {
    font-size:62px;
  }
  .download-panel p {
    font-size:16px;
    margin-top:19px;
  }
  .download-panel p>br {
    display:none;
  }
  .store-buttons {
    flex-direction:column;
    gap:12px;
    margin-top:25px;
  }
  .store-button {
    width:min(260px,100%);
    min-height:65px;
    padding-inline:20px;
    gap:16px;
  }
  .store-button strong {
    font-size:21px;
  }
  .download-platforms {
    font-size:12px;
    margin-top:22px;
    letter-spacing:1px;
  }
  .faq-section {
    padding-top:0;
  }
  .faq-grid {
    gap:15px;
  }
  .faq-grid h2 {
    font-size:34px;
  }
  .faq-list summary {
    padding:20px 0;
    gap:20px;
    font-size:16px;
    line-height:1.7;
  }
  .faq-answer {
    font-size:16px;
  }
        .back-top {
    margin-inline-start:0;
    width:100%;
    font-size:14px;
  }
  .footer-bottom {
    flex-direction:column-reverse;
    font-size:12px;
    gap:23px;
    padding-top:22px;
  }
    .risk-note {
    font-size:12px;
    margin-top:18px;
  }
  .site-footer {
    padding-top:34px;
    padding-bottom:23px;
  }
  .dialog-top {
    padding:10px 13px;
  }
  .dialog-top h2 {
    font-size:16px;
  }
  .dialog-caption {
    padding:13px 16px;
    font-size:14px;
  }
  .document-container {
    width:calc(100% - 38px);
  }
  .document-main {
    padding-block:42px 65px;
  }
  .document-main h1 {
    font-size:36px;
  }
  .document-main h2 {
    font-size:23px;
  }
  .document-main p,.document-main li {
    font-size:16px;
  }
  .document-note {
    padding:16px 19px;
  }
}
@media(max-width:360px) {
  .header-actions>.button {
    padding-inline:9px;
    gap:7px;
    font-size:12px;
  }
  .logo-window {
    width:104px;
  }
  .hero h1 {
    font-size:37px;
  }
  .card-topline .editorial-code {
    font-size:11px;
    letter-spacing:0;
  }
  .card-copy h3 {
    font-size:25px;
  }
  .ai-response {
    width:96%;
  }
  .ai-visual {
    padding:0;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   الشريطُ الثابتُ وقائمةُ الجوّالِ والتذييلُ — المنطقُ مأخوذٌ من صفحةِ فوركس
   برو لا شكلُها. الهُويّةُ البصريّةُ لخوارزمَ كما هي.

   ⚠️⚠️⚠️ الشريطُ ثابتٌ لا يمرّ: على صفحةٍ طويلةٍ كان الزائرُ ينزل فيفقد
      كلَّ طريقٍ للرجوعِ ولزرِّ التحميل. والثباتُ بالالتصاقِ لا بالتثبيتِ
      المطلقِ عمداً — الملتصقُ يبقى في تدفّقِ الصفحةِ فلا يقفز المحتوى
      تحته ولا يحتاج حشوةً تعويضيّةً في الجسم.
   ⚠️⚠️ ومعه تعويضُ التمريرِ إلزاميّاً: بلا حشوةِ تمريرٍ تساوي ارتفاعَ
      الشريطِ، كلُّ نقرةٍ على رابطٍ داخليٍّ تُخفي عنوانَ القسمِ تحتَ الشريط.
      والقيمةُ تتغيّر مع كلّ مقاسٍ لأنّ ارتفاعَ الشريطِ يتغيّر.
   ⚠️ ولا يُخفى الشريطُ عند النزولِ ولا يتقلّص: قِستُ ذلك في فوركس برو
      فوجدتُه قراراً مقصوداً — الحركةُ المفاجئةُ تُفقد الزائرَ موضعَه.
   ⛔ ولا أنماطَ سطريّةً في الصفحة: سياسةُ الأمانِ تمنع كلَّ نمطٍ مكتوبٍ
      داخلَ الوسم، فيُهمَل بصمتٍ. كلُّ شيءٍ هنا.
   ════════════════════════════════════════════════════════════════════════ */
html {
  scroll-padding-top:112px;
}
.site-header {
  position:sticky;
  top:0;
  backdrop-filter:blur(20px);
}

/* ⚠️ القسمُ الحاليُّ يُضاء: الزائرُ في صفحةٍ واحدةٍ طويلةٍ لا يعرف موضعَه
   من الشريط. والمقياسُ «أوّلُ قسمٍ عبَر ثلثَ الشاشةِ العلويّ» لا «الأكثرَ
   ظهوراً» — لأنّ قسماً طويلاً يبقى الأكثرَ ظهوراً وأنت قد جاوزتَه. */
.desktop-nav a {
  position:relative;
}
.desktop-nav a.is-active {
  color:white;
}
.desktop-nav a.is-active:after {
  content:"";
  position:absolute;
  inset-inline:0;
  bottom:-9px;
  height:2px;
  border-radius:2px;
  background:var(--cyan);
}

/* ── قائمةُ الجوّال: لوحةٌ تغطّي الشاشةَ لا قائمةٌ منسدلة ──
   ⚠️⚠️ طبقتُها **تحتَ** الشريطِ عمداً: لو علَتْه غطّت زرَّ الإغلاقِ نفسَه
      فلا يبقى للزائرِ مخرجٌ إلّا زرُّ الرجوع.
   ⚠️ وتمريرُ الصفحةِ خلفَها يُقفَل: بلا ذلك يتحرّك المحتوى تحت أصبعِه
      وهو يظنّ أنّه يمرّر القائمة.
   ⛔ ولا خلفيّةَ معتمةٌ منفصلةٌ هنا: اللوحةُ نفسُها تغطّي الشاشةَ كاملةً،
      فطبقةٌ تحتها لا تُنقَر أبداً. أضفتُها أوّلاً ثمّ قِستُ أنّ النقرةَ تقع
      على اللوحةِ لا عليها فحذفتُها — عنصرٌ لا يُنقَر عنصرٌ ميّت.
   ⚠️ ومخارجُ الإغلاقِ أربعةٌ بلا خلفيّة: الزرُّ نفسُه، ومفتاحُ الهروب،
      ونقرةُ أيِّ رابطٍ فيها، وأيُّ نقرةٍ على شريطِ الرأسِ الظاهرِ فوقها.
   ⚠️ والإخفاءُ بالإظهارِ لا بالشفافيّةِ: الشفافُ يبقى في ترتيبِ التنقّلِ
      بالكيبورد فيقع التركيزُ على روابطَ لا تُرى. */
body.nav-open {
  overflow:hidden;
}
.mobile-nav {
  position:fixed;
  inset:0;
  z-index:15;
  background:#070c13f7;
  backdrop-filter:blur(24px);
  border-bottom:0;
  padding:96px 30px 34px;
  overflow-y:auto;
  overscroll-behavior:contain;
  transform:translateX(-100%);
  visibility:hidden;
  /* ⚠️⚠️⚠️ الإظهارُ يُبدَّل بلا تدريجٍ ومهلتُه عند الفتحِ صفرٌ وعند الإغلاقِ
     بطولِ الانزلاق. وضعتُ أوّلاً تدريجاً عليه فكان المتصفّحُ يعدّ اللوحةَ
     غيرَ مرئيّةٍ طولَ الثلثِ الأوّلِ من الثانية، فيسقط نقلُ التركيزِ إليها
     ولا يقع — قِستُه حيّاً: التركيزُ يبقى على الجسدِ. والإغلاقُ بمهلةٍ كي
     يُرى الانزلاقُ خارجاً قبل أن تختفي. */
  transition:transform .3s ease,visibility 0s linear .3s;
}
.mobile-nav.is-open {
  transform:translateX(0);
  visibility:visible;
  transition:transform .3s ease,visibility 0s;
}
.mobile-nav-inner {
  display:flex;
  flex-direction:column;
  max-width:520px;
  margin-inline:auto;
}
.mobile-nav a[data-nav] {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 0;
  min-height:54px;
  font-size:19px;
  color:#e8eef8;
  border-bottom:1px solid #ffffff0f;
}
.mobile-nav a[data-nav].is-active {
  color:var(--cyan);
}
.mobile-nav-arrow {
  font-size:18px;
  color:#7f8ea3;
}
/* ⚠️ زرّا المتجرَينِ في أسفلِ اللوحةِ لا زرُّ «تحميلٍ» عامّ: من فتح القائمةَ
   على جوّالِه يريد المتجرَ في نقرةٍ واحدةٍ لا في نقرتين. */
.mobile-nav-stores {
  display:grid;
  gap:12px;
  margin-top:28px;
}
.store-button-sm {
  min-height:64px;
}

/* ── زرُّ العودةِ للأعلى: عائمٌ يظهر بعد التمرير ──
   ⚠️ ويُخفى ما دامت اللوحةُ مفتوحةً: زرٌّ عائمٌ فوق قائمةٍ مفتوحةٍ يُنقَر
      بالخطأ بدلَ رابطٍ تحته. */
.to-top {
  position:fixed;
  inset-inline-end:20px;
  bottom:22px;
  z-index:30;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid #27384f;
  background:#0d141fe6;
  backdrop-filter:blur(10px);
  color:#dce6f4;
  font-size:20px;
  display:grid;
  place-items:center;
  opacity:0;
  visibility:hidden;
  transition:opacity .25s,visibility .25s;
}
.to-top.is-visible {
  opacity:1;
  visibility:visible;
}
body.nav-open .to-top {
  opacity:0;
  visibility:hidden;
}

/* ── التذييلُ: أربعةُ أعمدةٍ تنهار إلى عمودٍ واحد ──
   ⚠️⚠️ عمودُ «الدعم» فيه صفحةُ الدعمِ وصفحةُ حذفِ الحسابِ: الصفحتان كانتا
      موجودتَينِ في الموقعِ بلا رابطٍ واحدٍ يقود إليهما، والمتجرانِ يشترطان
      الوصولَ إليهما بلا تسجيلِ دخول. صفحةٌ بلا رابطٍ كصفحةٍ غيرِ موجودة. */
.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:38px;
}
.footer-brand {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:17px;
}
.footer-brand .logo-window {
  width:141px;
}
.footer-brand p {
  color:#92a6c0;
  font-size:15px;
  max-width:320px;
}
.footer-col h2 {
  font-size:13px;
  font-weight:600;
  letter-spacing:.04em;
  color:#e3edfb;
  margin-bottom:15px;
}
.footer-col ul {
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:11px;
}
.footer-col a {
  color:#92a6c0;
  font-size:14px;
}
.footer-col a:hover {
  color:#e3efff;
}
@media(max-width:900px) {
  .footer-grid {
    grid-template-columns:1fr 1fr;
    gap:34px 24px;
  }
}
@media(max-width:800px) {
  html {
    scroll-padding-top:98px;
  }
}
@media(max-width:560px) {
  html {
    scroll-padding-top:96px;
  }
  .mobile-nav {
    padding:92px 22px 30px;
  }
  .footer-grid {
    grid-template-columns:1fr;
    gap:28px;
    padding-bottom:30px;
  }
  .footer-brand {
    gap:14px;
  }
  .footer-brand p {
    font-size:14px;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   الواجهةُ الأولى — زرّا المتجرَينِ مكانَ زرَّي البدءِ والعرض، والغلافُ صورةٌ
   ممتدّةٌ على كاملِ عرضِ الشاشةِ بلا فيديو.

   ⚠️⚠️ زرّا المتجرَينِ في الواجهةِ الأولى وفي قسمِ التحميلِ وفي لوحةِ الجوّالِ:
      وجهةٌ واحدةٌ تتكرّر ثلاثَ مرّاتٍ ولا تتغيّر. وهذا منطقُ صفحةِ فوركس برو
      حرفاً بحرف — لا زرَّ «ابدأ» ولا «شاهد العرض»: كلُّ طريقٍ يقود للمتجر.
   ⚠️ والغلافُ لم يعد زرّاً: أُزيل مثلّثُ التشغيلِ ومدّةُ المقطعِ معاً، فبقاءُ
      أحدِهما على صورةٍ لا تُنقَر وعدٌ كاذبٌ للزائر.
   ⚠️ وعلى الجوّالِ تُزاح الصورةُ إلى يمينِها بالقصّ: المشهدُ عريضٌ والرجلُ في
      طرفِه، فالقصُّ من الوسطِ يُخرجه من الكادرِ ويُبقي الشاشاتِ وحدَها.
   ════════════════════════════════════════════════════════════════════════ */
.hero-stores {
  margin-top:34px;
}
.cinema-wrap {
  width:100%;
}
.cinema {
  border-radius:0;
  border-inline:0;
  border-block:1px solid #668fba2e;
  cursor:default;
}
.cinema:hover .cinema-image {
  transform:none;
}
.cinema-top,.cinema-bottom {
  left:48px;
  right:48px;
}
@media(max-width:800px) {
  .cinema-top,.cinema-bottom {
    left:22px;
    right:22px;
  }
}
@media(max-width:560px) {
  .hero-stores {
    flex-direction:column;
    align-items:center;
    gap:11px;
    margin-top:26px;
  }
  .hero-stores .store-button {
    width:min(330px,100%);
    min-width:0;
    min-height:62px;
  }
  .cinema {
    height:430px;
  }
  .cinema-image {
    object-position:78% center;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   قسمُ «عن خوارزم» — عزلُ الكتلةِ وضبطُ التنسيقِ وتفاعلٌ بصريٌّ عند الوصول.

   ⚠️⚠️ العنوانُ يثبت والنصُّ يمرّ: العمودُ الأيمنُ كان يقف وحدَه في فراغٍ
      طويلٍ لأنّ عمودَ النصِّ أطولُ منه بكثير. وتثبيتُه يملأ الفراغَ بحركةٍ
      لها معنًى بدلَ أن يملأه سكونٌ أبيض.
   ⚠️ والكتلةُ النصّيّةُ داخلَ لوحةٍ لها حدٌّ وخلفيّة: هذا هو «العزل» — تفصل
      النصَّ عن سوادِ الصفحةِ فيبدو شيئاً قائماً لا كلاماً معلّقاً.
   ⚠️⚠️⚠️ والكشفُ عند الوصولِ **مشروطٌ بعلامةِ الجافاسكربت**: بلا الشرطِ
      يصير الإخفاءُ دائماً لمن تعثّر عنده الملفُّ فلا يرى القسمَ أبداً.
      الافتراضُ ظهورٌ، والإخفاءُ لا يقع إلّا حين نملك ما يكشف.
   ════════════════════════════════════════════════════════════════════════ */
.about-grid {
  gap:74px;
  align-items:start;
}
.section-intro {
  position:sticky;
  top:130px;
}
.about-panel {
  position:relative;
  background:linear-gradient(180deg,#0a121c,#080d15);
  border:1px solid #18232f;
  border-radius:20px;
  padding:34px 38px 32px;
  transition:border-color .3s,box-shadow .3s;
}
.about-panel:before {
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:30px;
  bottom:30px;
  width:2px;
  border-radius:2px;
  background:linear-gradient(180deg,#2bbbf3,#2bbbf300);
}
.about-panel:hover {
  border-color:#22374d;
  box-shadow:0 18px 60px #0006;
}
.about-copy {
  padding-top:0;
}
.text-link>span {
  transition:transform .25s;
}
.text-link:hover {
  color:white;
  border-bottom-color:#54acff;
}
.text-link:hover>span {
  transform:translate(-5px,5px);
}

/* الكشفُ عند الوصول */
.js [data-reveal] {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .7s ease,transform .7s ease;
}
.js [data-reveal].is-in {
  opacity:1;
  transform:none;
}

@media(max-width:900px) {
  .section-intro {
    position:static;
  }
}
@media(max-width:560px) {
  .about-grid {
    gap:30px;
  }
  .about-panel {
    padding:26px 22px 24px;
    border-radius:16px;
  }
  .about-panel:before {
    top:22px;
    bottom:22px;
  }
}

/* ⚠️ خطُّ روابطِ الشريطِ أكبر: أربعةَ عشرَ كانت صغيرةً على شاشةٍ عريضةٍ
   إلى جانبِ شعارٍ وزرٍّ كبيرَين. والزيادةُ محسوبةٌ لا مرسَلة — قِستُ عرضَ
   الشريطِ عند كلِّ مقاسٍ حتّى ٩٠٠ نقطةٍ فلم يتزاحم شيء. */
.desktop-nav a {
  font-size:16.5px;
}
@media(max-width:1100px) {
  .desktop-nav {
    gap:18px;
  }
  .desktop-nav a {
    font-size:15.5px;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   شريطُ المتجرَينِ الأوسطُ وقسمُ الخطواتِ الثلاث.

   ⚠️ الحثُّ يتكرّر ووجهتُه لا تتغيّر: الواجهةُ الأولى، ثمّ هذا الشريطُ في
      المنتصف، ثمّ قسمُ التحميل، ومعها لوحةُ الجوّال. أربعةُ مواضعَ ووجهةٌ
      واحدة — وهذا منطقُ صفحةِ فوركس برو لا شكلُها.
   ⛔ ولا قسمَ آراءٍ هنا: لا يُكتب رأيُ متدرّبٍ لم يقُله. المراجعاتُ الملفّقةُ
      التي وجدتُها في فوركس برو مخالفةٌ صريحةٌ عقوبتُها إسقاطُ النتائج.
   ════════════════════════════════════════════════════════════════════════ */
.store-strip {
  border-block:1px solid #ffffff10;
  background:linear-gradient(180deg,#080d15,#060a11);
  padding-block:34px;
}
.store-strip-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:34px;
  flex-wrap:wrap;
}
.store-strip-inner p {
  color:#9aa9bd;
  font-size:16px;
  margin-top:9px;
}
.store-strip-buttons {
  margin-top:0;
}
.steps-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  list-style:none;
  margin:0;
  padding:0;
}
.step-card {
  position:relative;
  background:linear-gradient(180deg,#0a121c,#080d15);
  border:1px solid #18232f;
  border-radius:20px;
  padding:30px 30px 28px;
  transition:border-color .3s,transform .3s;
}
.step-card:hover {
  border-color:#22374d;
  transform:translateY(-4px);
}
.step-num {
  display:inline-block;
  font:600 13px/1 Arial,sans-serif;
  letter-spacing:1.5px;
  color:#4cc8ff;
  border:1px solid #24455e;
  border-radius:30px;
  padding:7px 13px;
  margin-bottom:19px;
}
.step-card h3 {
  font-size:22px;
  font-weight:600;
  margin-bottom:11px;
}
.step-card p {
  color:#93a2b6;
  font-size:16px;
  line-height:1.9;
}
@media(max-width:900px) {
  .steps-grid {
    grid-template-columns:1fr;
    gap:16px;
  }
  .store-strip-inner {
    gap:22px;
  }
}
@media(max-width:560px) {
  .store-strip {
    padding-block:26px;
  }
  .store-strip-inner {
    flex-direction:column;
    align-items:stretch;
    text-align:center;
  }
  .store-strip-buttons {
    flex-direction:column;
    align-items:center;
    gap:11px;
  }
  .store-strip-buttons .store-button {
    width:min(330px,100%);
    min-width:0;
    min-height:62px;
  }
  .step-card {
    padding:24px 22px 22px;
    border-radius:16px;
  }
  .step-card h3 {
    font-size:20px;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   جولةُ تصحيحٍ بصريّةٍ — ستّةُ مواضعَ أشار إليها المالكُ في لقطاتٍ حيّة.

   ⚠️⚠️⚠️ ١) الشعارُ كان يظهر داخلَ إطارٍ لامعٍ فجأةً: ذاك حلقةُ تركيزٍ رسمها
      المتصفّحُ لأنّ زرَّ العودةِ للأعلى كان ينقل التركيزَ إلى الشعار. أُزيل
      النقلُ من السكربت، وضُبط الإظهارُ هنا ليكون للكيبورد وحدَه.
   ⚠️⚠️ ٢) أزرارُ المتجرَينِ داخلَ لوحةِ الجوّالِ كانت منهارة: أيقونةٌ في زاويةٍ
      ونصٌّ باهتٌ في سطرٍ آخر. السببُ قاعدةٌ قديمةٌ تخصّ روابطَ اللوحةِ كلَّها
      وتغلب قاعدةَ الزرِّ بالوزن — فحُصرت في روابطِ التنقّلِ وحدَها.
   ⚠️ ٣) نصوصُ الأزرارِ في الوسط: كانت تُحاذى لليسارِ فتبدو مائلةً في صفحةٍ
      عربيّةٍ متمركزة.
   ⚠️ ٤) الشارةُ العلويّةُ لم تعد صندوقاً بنجمة: خطٌّ قصيرٌ ملوّنٌ ثمّ نصّ.
      ⛔ ولا تُعِدها كبسولةً محاطةً بإطار.
   ⚠️ ٥) عناوينُ الأقسامِ كُبّرت في كلّ المقاسات.
   ════════════════════════════════════════════════════════════════════════ */

/* ── عناوينُ الأقسامِ أكبر ── */
h2 {
  font-size:clamp(40px,5vw,66px);
  line-height:1.3;
}
h3 {
  font-size:23px;
}
.step-card h3 {
  font-size:24px;
}

/* ── نصوصُ الأزرارِ في الوسط ── */
.store-button {
  justify-content:center;
  text-align:center;
  gap:15px;
}
.store-button>span:not(.store-arrow) {
  align-items:center;
  text-align:center;
}
.store-button small {
  text-align:center;
  direction:rtl;
}

/* ── لوحةُ الجوّال: قاعدةُ الروابطِ لا تمسّ أزرارَ المتجر ── */
.mobile-nav a:not([data-nav]):not(.store-button) {
  display:block;
}
.mobile-nav .store-button {
  display:flex;
  color:#081326;
  font-size:16px;
  padding:9px 19px;
  align-items:center;
}
.mobile-nav .store-button strong {
  color:#081326;
}
.mobile-nav .store-button small {
  color:#33415a;
}

/* ── الشارةُ العلويّة: خطٌّ ونصّ، بلا إطارٍ ولا نجمة ── */
.hero-eyebrow {
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:#b9c8dc;
  font-size:15px;
  font-weight:500;
  letter-spacing:.3px;
  margin-bottom:26px;
  padding:0;
  border:0;
  background:none;
}
.eyebrow-rule {
  width:46px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#21ddcb,#487cff);
}
.eyebrow-x {
  color:#4cc8ff;
  font-family:Arial,sans-serif;
}

/* ── حلقةُ التركيزِ للكيبوردِ وحدَه ── */
.brand:focus {
  outline:none;
}
.brand:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:4px;
  border-radius:6px;
}

@media(max-width:800px) {
  h2 {
    font-size:clamp(38px,7.4vw,54px);
  }
}
@media(max-width:560px) {
  h2 {
    /* ⚠️ القياسُ لا التقدير: القاعدةُ القديمةُ كانت تُخرج أربعةً وثلاثين على
       جوّالٍ عرضُه ثلاثُ مئةٍ وتسعون. هذه تُخرج أربعينَ على نفسِ الجهاز. */
    font-size:clamp(36px,10.3vw,46px);
    line-height:1.34;
    letter-spacing:-.6px;
  }
  .hero-eyebrow {
    font-size:13px;
    gap:10px;
    margin-bottom:22px;
  }
  .eyebrow-rule {
    width:32px;
  }
}

/* ⚠️ أزرارُ المتجرِ في لوحةِ الجوّال: كانت تأخذ عرضَ محتواها وتلتصق بالحافّة
   (قِستُ مئتين وستّين نقطةً داخل ثلاثِ مئةٍ وستٍّ وأربعين). صارت تملأ عرضَ
   اللوحةِ فتستقرّ في وسطِها كما بقيّةِ الصفحة. */
.mobile-nav-stores {
  justify-items:stretch;
}
.mobile-nav-stores .store-button {
  width:100%;
  min-width:0;
}

/* ⚠️ نصوصُ الواجهةِ الأولى على الجوّال: كُبّرت قليلاً بطلبِ المالك —
   الشارةُ والوصفُ وسطرُ الملاحظات. والعنوانُ كما هو. */
@media(max-width:560px) {
  .hero-eyebrow {
    font-size:15px;
  }
  .hero-description {
    font-size:18px;
    line-height:1.85;
  }
  .hero-notes {
    font-size:13px;
  }
}