/* BMD - Marketing Numbers Diagnostic: ad landing page + VSL page.
   Layered on the inline bmd.css copy. Tokens only; no new colors. */

/* The founding/full price swap and the form steps toggle [hidden] on
   elements whose classes set display (.bmd-stat is flex). */
[hidden] { display: none !important; }

/* ------------------------------------------------------------ Header */
.dx-header .site-header__inner { min-height: 60px; }
.dx-header__lang {
  font-family: var(--font-arabic);
  font-size: 13px;
  color: var(--steel);
  text-decoration: none;
}
.dx-header__lang:hover { color: var(--navy-900); }
[dir="rtl"] .dx-header__lang { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
.dx-header .site-header__cta { gap: 22px; }

/* ------------------------------------------------------------ Hero
   Headline and VSL are full-width rows. Lead, CTAs and the price rail
   sit in the two-column block under the video. */
.dx-hero__head .h-display { margin: 18px 0 0; max-width: none; }
.dx-hero .hero__lead { max-width: 52ch; }
.dx-hero .hero__inner {
  margin-top: clamp(28px, 4vw, 44px);
  align-items: flex-start;
}
.dx-offer-line {
  margin: 22px 0 0;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--steel);
}
[dir="rtl"] .dx-offer-line { font-family: var(--font-arabic); letter-spacing: 0; font-size: 14px; }
.dx-offer-line strong { color: var(--navy-900); font-weight: 600; }

/* Price rail */
.dx-price__was {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--steel);
  text-decoration: line-through;
  text-decoration-color: var(--steel-400);
}
.dx-price__value {
  font-family: var(--font-serif);
  font-size: clamp(40px, 4.4vw, 52px);
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--navy-900);
  font-variant-numeric: lining-nums;
}
.dx-price__value small {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--steel);
  margin-inline-start: 6px;
}
[dir="rtl"] .dx-price__value small { font-family: var(--font-arabic); letter-spacing: 0; font-size: 15px; }
[dir="rtl"] .dx-price__was { font-family: var(--font-arabic); font-size: 14px; }
/* These card eyebrows carry Arabic words, not just numerals: Bukra, untracked. */
[dir="rtl"] .dx-pricing .bmd-card__eyebrow,
[dir="rtl"] .dx-vsl__points .bmd-card__eyebrow { font-family: var(--font-arabic); letter-spacing: 0; text-transform: none; font-size: 13px; font-weight: 700; }

/* Player sits directly under the H1, full width of the hero. */
.dx-hero-video { margin-top: clamp(18px, 2.4vw, 28px); }
.dx-hero-video .dx-video { margin: 0; max-width: none; width: 100%; }

/* ------------------------------------------------------------ Questions */
.dx-questions { max-width: 820px; }
.dx-questions .rowlist__text { font-size: clamp(17px, 1.8vw, 20px); line-height: 1.45; color: var(--navy-900); }
.dx-note {
  margin-top: 26px;
  font-size: 15px;
  color: var(--steel);
  max-width: 60ch;
}

/* ------------------------------------------------------------ Navy mechanism band */
.dx-band { padding-block: var(--section-y); }
.dx-band__inner { display: flex; flex-wrap: wrap; gap: 28px clamp(32px, 6vw, 80px); }
.dx-band__head { flex: 1 1 360px; }
.dx-band__head .h-band { margin-top: 14px; max-width: 18ch; }
.dx-band__body { flex: 1 1 420px; font-size: 17px; line-height: 1.7; color: var(--navy-200); max-width: 58ch; }
.dx-band__body strong { color: var(--bone); font-weight: 600; }

/* ------------------------------------------------------------ Weeks */
.dx-weeks .ladder__title { min-width: 250px; }
.dx-weeks .ladder__week {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--steel);
  margin-bottom: 6px;
}
[dir="rtl"] .dx-weeks .ladder__week { font-family: var(--font-arabic); letter-spacing: 0; font-size: 13px; font-weight: 700; }

/* ------------------------------------------------------------ Fit */
.dx-fit .shift__text { line-height: 1.5; }

/* ------------------------------------------------------------ Pricing */
.dx-pricing { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: stretch; }
.dx-pricing .bmd-card__body p + p { margin-top: 12px; }
.dx-pricing__terms { margin: 18px 0 22px; display: flex; flex-direction: column; gap: 8px; }
.dx-pricing__terms li { font-size: 15px; line-height: 1.5; padding-inline-start: 18px; position: relative; }
.dx-pricing__terms li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.7em;
  width: 8px;
  height: 1.5px;
  background: var(--navy-900);
}
.dx-guarantee { background: var(--navy-900); color: var(--navy-200); border-color: var(--navy-700); }
.dx-guarantee .bmd-card__eyebrow { color: var(--ochre-400); }
.dx-guarantee .bmd-card__title { color: var(--bone); }
.dx-guarantee .bmd-card__body { color: var(--navy-200); }
.dx-guarantee .bmd-card__body strong { color: var(--bone); font-weight: 600; }

/* ------------------------------------------------------------ Value stack
   What each part is worth bought on its own, just above the price cards.
   Value only: the price cards keep the founding/full switch. Three columns
   (item, what it replaces, value) on wide screens; on phones the item takes
   the full width and the value sits under it, at the end. landing.css
   re-tunes it for the new side of the A/B test. */
.dx-stack {
  margin-bottom: 18px;
  padding: clamp(22px, 3vw, 32px);
  background: var(--surface-card);
  border: 1px solid var(--bone-edge);
  border-top: var(--rule-weight-strong) solid var(--navy-900);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
}
.dx-stack__title {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(22px, 2.4vw, 28px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--navy-900);
}
[dir="rtl"] .dx-stack__title { font-family: var(--font-arabic); font-weight: 700; letter-spacing: 0; line-height: 1.5; }
.dx-stack__sub { margin: 8px 0 0; font-size: 15px; line-height: 1.6; color: var(--steel); }
.dx-stack__list { margin: 22px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--bone-edge); }
.dx-stack__row {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(8em, auto);
  gap: 4px 28px;
  align-items: baseline;
  padding-block: 15px;
  border-bottom: 1px solid var(--bone-edge);
}
.dx-stack__item { font-size: 16px; line-height: 1.55; font-weight: 600; color: var(--navy-900); }
.dx-stack__alt { font-size: 14px; line-height: 1.55; color: var(--steel); }
.dx-stack__list--bonus .dx-stack__item { grid-column: 1 / 3; font-weight: 400; color: var(--navy-800); }
.dx-stack__list--bonus .dx-stack__row:last-child { border-bottom: 0; }
.dx-stack__value {
  text-align: end;
  white-space: nowrap;
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--navy-900);
  font-variant-numeric: lining-nums tabular-nums;
}
[dir="rtl"] .dx-stack__value { font-family: var(--font-arabic); font-weight: 700; }
.dx-stack__value small {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.08em;
  color: var(--steel);
}
[dir="rtl"] .dx-stack__value small { font-family: var(--font-arabic); letter-spacing: 0; font-size: 14px; }
.dx-stack__row--risk .dx-stack__value { white-space: normal; font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: var(--ochre-ink); }
[dir="rtl"] .dx-stack__row--risk .dx-stack__value { font-family: var(--font-arabic); }
.dx-stack__label {
  margin: 28px 0 0;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ochre-ink);
}
[dir="rtl"] .dx-stack__label { font-family: var(--font-arabic); letter-spacing: 0; font-size: 14px; font-weight: 700; text-transform: none; }
.dx-stack__list--bonus { margin-top: 10px; }
.dx-stack__total {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px 24px;
  margin: 0;
  padding-top: 18px;
  border-top: var(--rule-weight-strong) solid var(--navy-900);
}
.dx-stack__total-label { font-size: 16px; font-weight: 600; color: var(--navy-900); }
[dir="rtl"] .dx-stack__total-label { font-weight: 700; }
.dx-stack__total .dx-stack__value { font-size: clamp(26px, 3vw, 34px); line-height: 1.1; }
@media (max-width: 640px) {
  .dx-stack__row { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; }
  .dx-stack__item,
  .dx-stack__list--bonus .dx-stack__item { grid-column: 1 / -1; grid-row: 1; }
  .dx-stack__alt { grid-column: 1; grid-row: 2; }
  .dx-stack__value { grid-column: 2; grid-row: 2; }
}

/* ------------------------------------------------------------ FAQ */
.dx-faq { max-width: 860px; border-top: 1px solid var(--bone-edge); }
.dx-faq details { border-bottom: 1px solid var(--bone-edge); }
.dx-faq summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  padding-block: 20px;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(18px, 1.9vw, 21px);
  line-height: 1.3;
  color: var(--navy-900);
}
[dir="rtl"] .dx-faq summary { font-family: var(--font-arabic); font-weight: 700; font-size: 17px; line-height: 1.6; }
.dx-faq summary::-webkit-details-marker { display: none; }
.dx-faq summary::after {
  content: "+";
  font-family: var(--font-mono);
  font-size: 18px;
  color: var(--steel);
  flex: none;
}
.dx-faq details[open] summary::after { content: "\2212"; }
.dx-faq__answer { padding-bottom: 22px; font-size: 16px; line-height: 1.65; color: var(--text-body); max-width: 66ch; }

/* ------------------------------------------------------------ Application form */
.dx-apply .lead__inner .h-band { max-width: 22ch; }
.dx-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.dx-form .lead__status--error { color: var(--critical); }
.dx-form .lead__foot { justify-content: flex-start; }
.dx-form .lead__foot .lead__contact { margin-inline-start: auto; }
.dx-steps {
  display: flex;
  gap: 18px;
  margin-bottom: 20px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--steel-400);
}
[dir="rtl"] .dx-steps { font-family: var(--font-arabic); letter-spacing: 0; font-size: 13px; font-weight: 700; }
.dx-steps span { padding-bottom: 6px; border-bottom: 1.5px solid var(--bone-edge); }
.dx-steps span.is-current { color: var(--navy-900); border-bottom-color: var(--ochre); }
.dx-steps span.is-done { color: var(--steel); border-bottom-color: var(--navy-900); }
.dx-field--wide { grid-column: 1 / -1; }
select.bmd-input {
  appearance: none;
  -webkit-appearance: none;
  padding-inline-end: 36px;
  cursor: pointer;
}
.dx-select { position: relative; display: block; }
.dx-select::after {
  content: "";
  position: absolute;
  inset-inline-end: 15px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--steel);
  border-bottom: 1.5px solid var(--steel);
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}
.dx-back {
  font: inherit;
  font-size: 14px;
  background: none;
  border: 0;
  padding: 0;
  color: var(--steel);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.dx-back:hover { color: var(--navy-900); }
.dx-consent { margin: 14px 0 0; font-size: 12px; line-height: 1.5; color: var(--steel); }
.dx-reassure {
  margin: 18px 0 0;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--navy-300);
}
[dir="rtl"] .dx-reassure { font-family: var(--font-arabic); letter-spacing: 0; font-size: 13px; }

/* ------------------------------------------------------------ Newsletter */
.dx-news { background: var(--bone-sunken); border-top: 1px solid var(--bone-edge); }
.dx-news__inner { display: flex; flex-wrap: wrap; gap: 28px clamp(32px, 6vw, 72px); align-items: flex-start; }
.dx-news__copy { flex: 1 1 340px; }
.dx-news__copy .h-section { margin-top: 12px; }
.dx-news__copy p { margin-top: 14px; font-size: 16px; line-height: 1.6; color: var(--steel); max-width: 48ch; }
.dx-news__form { flex: 1 1 420px; }
.dx-news__form .lead__panel { border-top: 2px solid var(--navy-900); }

/* ------------------------------------------------------------ Footer (minimal) */
.dx-footer { background: var(--navy-900); border-top: 1px solid var(--navy-700); }
.dx-footer__inner {
  padding-block: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--navy-300);
}
[dir="rtl"] .dx-footer__inner { font-family: var(--font-arabic); letter-spacing: 0; font-size: 13px; }
.dx-footer__inner img { height: 20px; width: auto; display: block; }
.dx-footer__links { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.dx-footer__links a { color: var(--navy-200); }
.dx-footer__links a:hover { color: var(--bone); }

/* ------------------------------------------------------------ Sticky mobile CTA */
.dx-sticky {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 60;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px var(--pad-x) calc(10px + env(safe-area-inset-bottom));
  background: var(--bone-raised);
  border-top: 1px solid var(--bone-edge);
  box-shadow: var(--shadow-3);
  transform: translateY(110%);
  transition: transform var(--dur-base) var(--ease-out);
}
.dx-sticky.is-visible { transform: translateY(0); }
.dx-sticky__text { font-size: 13px; line-height: 1.35; color: var(--steel); }
.dx-sticky__text strong { display: block; color: var(--navy-900); font-weight: 600; }
@media (max-width: 760px) {
  .dx-sticky { display: flex; }
  .dx-header .site-header__cta .bmd-btn { display: none; }
  body.dx-has-sticky { padding-bottom: 72px; }
}

/* ------------------------------------------------------------ VSL page */
.dx-vsl { padding-block: clamp(24px, 4vw, 48px) clamp(40px, 6vw, 72px); }
.dx-vsl__head { max-width: 860px; margin-inline: auto; text-align: center; }
.dx-vsl__head .h-display { font-size: clamp(28px, 3.6vw, 44px); margin: 14px auto 0; max-width: 24ch; }
[dir="rtl"] .dx-vsl__head .h-display { max-width: 22ch; }
.dx-vsl__sub { margin: 12px auto 0; font-size: 17px; line-height: 1.55; color: var(--text-body); max-width: 52ch; }
.dx-video {
  position: relative;
  max-width: 960px;
  margin: clamp(20px, 3vw, 32px) auto 0;
  aspect-ratio: 16 / 9;
  background: var(--navy-900);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-3);
}
.dx-video video { width: 100%; height: 100%; display: block; object-fit: cover; background: var(--navy-900); }
.dx-video__play {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 0;
  cursor: pointer;
  color: var(--bone);
  background: rgba(15, 27, 45, 0.35);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
[dir="rtl"] .dx-video__play { font-family: var(--font-arabic); letter-spacing: 0; font-size: 15px; font-weight: 700; }
.dx-video__play-icon {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: var(--ochre-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--dur-fast) var(--ease-out);
}
.dx-video__play:hover .dx-video__play-icon { background: var(--ochre-deep); }
.dx-video__play-icon svg { width: 26px; height: 26px; margin-inline-start: 4px; }
[dir="rtl"] .dx-video__play-icon svg { margin-inline-start: 0; margin-inline-end: 4px; transform: scaleX(1); }
.dx-video.is-playing .dx-video__play { display: none; }
.dx-video.is-loading .dx-video__play-icon { animation: dx-pulse 0.9s var(--ease-out) infinite alternate; }
@keyframes dx-pulse { to { opacity: 0.55; } }

/* Quality menu (Auto / 1080p / 720p / 480p): top corner at the end of the
   reading direction, shown on hover or focus, always on touch screens. */
.dx-quality { position: absolute; top: 12px; inset-inline-end: 12px; z-index: 2; opacity: 0; transition: opacity var(--dur-fast) var(--ease-out); }
.dx-quality[hidden] { display: none; }
.dx-video:hover .dx-quality,
.dx-quality:focus-within { opacity: 1; }
@media (hover: none) { .dx-quality { opacity: 1; } }
.dx-quality__btn,
.dx-quality__menu button {
  border: 0;
  color: var(--bone);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.dx-quality__btn { padding: 6px 10px; border-radius: var(--radius-sm); background: rgba(15, 27, 45, 0.78); }
[dir="rtl"] .dx-quality__btn,
[dir="rtl"] .dx-quality__menu button { font-family: var(--font-arabic); letter-spacing: 0; font-size: 13px; }
.dx-quality__btn:focus-visible,
.dx-quality__menu button:focus-visible { outline: 2px solid var(--ochre-ink); outline-offset: 2px; }
.dx-quality__menu { list-style: none; margin: 6px 0 0; padding: 4px; min-width: 120px; border-radius: var(--radius-sm); background: rgba(15, 27, 45, 0.92); }
.dx-quality__menu[hidden] { display: none; }
.dx-quality__menu button { display: block; width: 100%; padding: 7px 10px; background: none; text-align: start; border-radius: 2px; }
.dx-quality__menu button:hover { background: rgba(244, 241, 236, 0.1); }
.dx-quality__menu button[aria-checked="true"] { color: var(--ochre-200); }
.dx-vsl__cta { margin-top: clamp(24px, 4vw, 36px); display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.dx-vsl__cta .dx-offer-line { margin: 0; }
.dx-vsl__points { max-width: 860px; margin-inline: auto; }
.dx-vsl__read { text-align: center; margin-top: 28px; font-size: 15px; }
.dx-vsl__read a { text-decoration: underline; text-underline-offset: 0.2em; }

@media (prefers-reduced-motion: reduce) {
  .dx-sticky { transition: none; }
}