/* ==========================================================
   START — Salezprint · Landing Page
   الثيم: كحلى غامق · ذهبى للتمييز · أخضر للأزرار · أحمر لعلامات المشاكل
   خط Lemonada للصفحة كلها. كل القيم توكنز فى :root.
   ========================================================== */

/* ---- Lemonada من الموقع نفسه (متحمّل مسبقاً فى index.html) ---- */
@font-face {
  font-family: 'Lemonada';
  font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(fonts/lemonada-arabic.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Lemonada';
  font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(fonts/lemonada-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---- الخلفيات الغامقة ---- */
  --bg:        #0A0F1C;  /* خلفية الصفحة */
  --bg-2:      #0F1626;  /* الأقسام البديلة */
  --bg-3:      #05070D;  /* أغمق درجة — الشريط العلوى والأقسام المميّزة */
  --card:      #141C2E;  /* الكروت */
  --card-2:    #1A2438;  /* عنصر جوه كارت */
  --line:      #1F2A40;  /* الحدود */

  /* ---- النص على الغامق ---- */
  --text:      #F2F4F8;
  --text-2:    #A7B0C0;

  /* ---- الألوان المميّزة ---- */
  --gold:      #F5B400;  /* الكلمات المهمة والأرقام والإطارات المميّزة */
  --gold-deep: #A16207;  /* الذهبى على الخلفية البيضا */
  --green:     #15803D;  /* الأزرار */
  --green-deep:#166534;  /* hover */
  --green-soft:#4ADE80;  /* تسمية «بعد» فى جدول المقارنة */
  --red:       #EF4444;  /* علامة ✕ للمشاكل */
  --red-bg:    #2A1620;

  /* ---- الأقسام الفاتحة ---- */
  --light:     #FFFFFF;
  --light-2:   #F3F5F9;
  --light-line:#E5E7EB;
  --ink:       #0A0F1C;
  --ink-2:     #4B5563;

  /* ---- الخط ---- */
  --font: 'Lemonada', sans-serif;

  /* ---- مقياس الخط (موبايل) — 24 → 21 → 18 → 17 → 15 → 12 ---- */
  --display: 24px;  --display-lh: 1.65;
  --h2: 21px;       --h2-lh: 1.7;
  --h3: 18px;       --h3-lh: 1.8;
  --body-lg: 17px;  --body-lg-lh: 1.95;
  --body: 17px;     --body-lh: 1.95;
  --small: 15px;    --small-lh: 1.9;
  --micro: 12px;    --micro-lh: 1.8;
  --bar: 11px;      /* نص الشريط العلوى على الموبايل بس */
  --price: 44px;
  --btn-font: 16px;

  /* ---- المسافات ---- */
  --s-4: 4px;   --s-8: 8px;   --s-12: 12px;  --s-16: 16px;  --s-24: 24px;
  --s-32: 32px; --s-48: 48px; --s-64: 64px;  --s-96: 96px;  --s-128: 128px;
  --section-y: 72px;
  --inner: 24px;
  --gap-p: 24px;
  --gutter: 20px;

  /* ---- العرض ---- */
  --w-read: 680px;
  --w-wide: 1080px;
  --w-btn: 480px;

  /* ---- الأشكال ---- */
  --btn-h: 64px;
  --btn-h-sm: 56px;
  --radius-sm: 12px;
  --radius: 20px;
  --pill: 999px;
  --border: 1px solid var(--line);
  --border-gold: 1px solid var(--gold);
  --t: 120ms ease;

  /* ---- الحركة عند التمرير ---- */
  --rise: 24px;
  --rise-dur: 600ms;
}

@media (max-width: 374px) { :root { --bar: 10px; } }

@media (min-width: 768px) {
  :root {
    --display: 34px;  --display-lh: 1.6;
    --h2: 26px;       --h2-lh: 1.6;
    --h3: 19px;
    --body-lg: 18px;
    --price: 56px;
    --section-y: 112px;
    --inner: 48px;
    --gutter: 48px;
  }
}

/* ---------- الأساس ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--btn-h-sm) + var(--s-16)); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: var(--body);
  line-height: var(--body-lh);
  font-weight: 400;
}
img { display: block; max-width: 100%; height: auto; }
p, ul, ol, figure, blockquote, h1, h2, h3 { margin: 0; }
ul, ol { padding: 0; list-style: none; }
strong { font-weight: 600; }
h1, h2, h3 { font-weight: 600; color: inherit; text-wrap: balance; }
h1 { font-size: var(--display); line-height: var(--display-lh); }
h2 { font-size: var(--h2); line-height: var(--h2-lh); }
h3 { font-size: var(--h3); line-height: var(--h3-lh); }
.hl { color: var(--gold); }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip {
  position: absolute; inset-inline-start: var(--s-8); top: calc(-1 * var(--s-64)); z-index: 100;
  background: var(--gold); color: var(--ink); padding: var(--s-8) var(--s-16); border-radius: var(--pill);
}
.skip:focus { top: var(--s-8); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.sec--light :focus-visible { outline-color: var(--ink); }

/* ---------- الأقسام ---------- */
main { text-align: center; }
.sec { padding: var(--section-y) var(--gutter); }
.sec--paper   { background: var(--bg); }
.sec--surface { background: var(--bg-2); }
.sec--dark    { background: var(--bg-3); border-block: var(--border); }
.sec--light   { background: var(--light); color: var(--ink); }

.read { max-width: var(--w-read); margin-inline: auto; }
.wide { max-width: var(--w-wide); margin-inline: auto; }
.read > * + *, .prose > * + * { margin-top: var(--gap-p); }
.read + .wide, .wide + .read, .wide + .wide { margin-top: var(--s-48); }
.read > h2 + *, .read > h1 + * { margin-top: var(--s-16); }

.sub, .small, .prose { color: var(--text-2); }
.small { font-size: var(--small); line-height: var(--small-lh); }
.sec--light .sub, .sec--light .small, .sec--light .prose { color: var(--ink-2); }
.sec--light .hl { color: var(--gold-deep); }

/* ---------- التسمية فوق العنوان: كبسولة غامقة ---------- */
.label {
  display: flex; align-items: center; gap: var(--s-8);
  width: fit-content; margin-inline: auto;
  padding: var(--s-4) var(--s-16);
  background: var(--bg-3); border: var(--border); border-radius: var(--pill);
  font-size: var(--micro); line-height: var(--micro-lh); font-weight: 500; color: var(--text);
}
.label::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.label .latin { letter-spacing: 1px; }
.sec--dark .label { background: var(--card); }
.sec--light .label { background: var(--ink); border-color: var(--ink); color: var(--light); }
.read > .label + h2 { margin-top: var(--s-16); }

/* ---------- البلوكات ---------- */
.card {
  background: var(--card); border: var(--border); border-radius: var(--radius);
  padding: var(--s-24);
}
.sec--light .card { background: var(--light-2); border-color: var(--light-line); }

.note {
  background: var(--card); border: var(--border); border-radius: var(--radius);
  padding: var(--inner) var(--s-24);
  font-weight: 500;
}
.note > * + * { margin-top: var(--s-12); }
.sec--light .note { background: var(--light-2); border-color: var(--light-line); }

.dark-box {
  background: var(--bg-3); color: var(--text-2);
  border: var(--border-gold); border-radius: var(--radius);
  padding: var(--inner) var(--s-24);
}
.dark-box > * + * { margin-top: var(--s-16); }
.dark-box__key { font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600; color: var(--text); }
.money { color: var(--gold); font-weight: 600; }

/* فاصل «·»: بيفضل فى النص، وبيترسم خط رفيع */
.sep {
  display: inline-block; width: 0; height: var(--s-12); overflow: hidden;
  margin-inline: var(--s-8); vertical-align: -1px;
  border-inline-start: 1px solid currentColor; opacity: .45;
  text-indent: var(--s-16); white-space: nowrap;
}

/* رقم داخل دايرة (الكورسات والأسئلة) */
.num-badge, .qa__n {
  display: inline-grid; place-items: center; flex: none;
  width: var(--s-32); height: var(--s-32); border-radius: 50%;
  background: var(--bg-3); border: var(--border-gold); color: var(--gold);
  font-size: var(--small); font-weight: 600; line-height: 1;
}

/* ---------- الشريط العلوى (بلوك 0) ---------- */
.topbar {
  position: sticky; top: 0; z-index: 50;
  height: var(--btn-h-sm);
  background: var(--bg-3); color: var(--text);
  border-bottom: var(--border);
}
.topbar__in {
  height: 100%; max-width: var(--w-wide); margin-inline: auto;
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-8);
  padding-inline: var(--s-12) var(--s-8);
}
.topbar__text { min-width: 0; line-height: 1.6; }
.topbar__offer { font-size: var(--bar); color: var(--text-2); white-space: nowrap; }
.topbar__timer { font-size: var(--bar); font-weight: 600; white-space: nowrap; }
.topbar__timer .countdown { color: var(--gold); margin-inline-start: var(--s-4); }
.topbar__btn {
  flex: none;
  display: flex; align-items: center; justify-content: center;
  min-height: 44px; padding-inline: 7px;
  background: var(--green); color: var(--light); text-decoration: none;
  font-weight: 600; font-size: var(--micro);
  border-radius: var(--pill);
  transition: background-color var(--t);
}
.topbar__btn:hover { background: var(--green-deep); }
.topbar__btn:active { transform: translateY(1px); }
@media (min-width: 768px) {
  .btn { padding-inline: var(--s-32); }
  .topbar__in { padding-inline: var(--gutter); }
  .topbar__text { display: flex; gap: var(--s-24); align-items: baseline; }
  .topbar__offer, .topbar__timer { font-size: var(--small); }
  .topbar__btn { padding-inline: var(--s-24); font-size: var(--small); }
}

/* ---------- الأزرار ---------- */
.cta { max-width: var(--w-btn); margin-inline: auto; }
.btn {
  display: flex; align-items: center; justify-content: center; gap: var(--s-12); text-align: center;
  width: 100%; min-height: var(--btn-h); padding: var(--s-12) var(--s-24);
  background: var(--green); color: var(--light); text-decoration: none;
  font-weight: 600; font-size: var(--btn-font); line-height: 1.7;
  border-radius: var(--pill);
  transition: background-color var(--t);
}
.btn::after { content: "←"; flex: none; font-weight: 400; }
.btn:hover { background: var(--green-deep); }
.btn:active { transform: translateY(1px); }
.cta__note {
  margin-top: var(--s-12);
  font-size: var(--small); line-height: var(--small-lh); color: var(--text-2);
}
.cta__note--micro { margin-top: var(--s-8); font-size: var(--micro); line-height: var(--micro-lh); }
.sec--cta { padding-block: var(--s-64); }

/* ---------- الهيرو (بلوك 1) ---------- */
.hero { padding-top: var(--s-48); }
.hero .read { max-width: var(--w-wide); }
.hero .read > :not(h1) { max-width: var(--w-read); margin-inline: auto; }
.kicker { font-size: var(--small); line-height: var(--small-lh); font-weight: 500; color: var(--text-2); }
.hero h1 { margin-top: var(--s-16); text-wrap: pretty; }
.lede { color: var(--text-2); }
.hero__h3 { font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600; }
.hero .vsl { margin-top: var(--s-32); }
.hero .cta { margin-top: var(--s-32); }
.filter {
  margin-top: var(--s-32) !important; padding: var(--s-16) var(--s-24);
  background: var(--card); border: var(--border); border-radius: var(--radius);
  font-size: var(--small); line-height: var(--small-lh); color: var(--text-2);
}

/* الفيديو */
.vsl {
  position: relative; aspect-ratio: 16 / 9; overflow: hidden;
  background: var(--bg-3); border: var(--border-gold); border-radius: var(--radius);
}
.vsl > img, .vsl > iframe, .vsl > .ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.vsl__play {
  position: absolute; inset: 0; margin: auto;
  width: var(--s-64); height: var(--s-64); border-radius: 50%; border: 0; cursor: pointer;
  display: grid; place-items: center;
  background: var(--gold); color: var(--ink);
  transition: transform var(--t);
}
.vsl__play svg { transform: scaleX(-1); } /* المثلث بيشاور لليسار فى RTL */
.vsl__play:hover { transform: scale(1.06); }
.vsl__play:active { transform: translateY(1px); }
.vsl.is-playing .vsl__play, .vsl.is-playing .ph, .vsl.is-playing > img { display: none; }
.ph {
  display: grid; place-items: start center; padding: var(--s-12);
  background: var(--bg-3); color: var(--text-2);
  font-size: var(--micro); line-height: var(--micro-lh);
}

/* ---------- القوايم: كل عنصر كارت صغير ---------- */
.rows { display: grid; gap: var(--s-8); }
.rows > li {
  padding: var(--s-16) var(--s-24);
  background: var(--card); border: var(--border); border-radius: var(--radius-sm);
}
.sec--light .rows > li { background: var(--light-2); border-color: var(--light-line); }
/* الأوجاع: علامة ✕ حمرا جوه مربع */
.rows--x > li { display: flex; align-items: center; gap: var(--s-16); text-align: start; }
.rows--x > li::before {
  content: "✕"; flex: none; display: grid; place-items: center;
  width: var(--s-32); height: var(--s-32); border-radius: 8px;
  background: var(--red-bg); color: var(--red); font-size: var(--small); font-weight: 600;
}
.rows--tight { gap: 0; margin-top: var(--s-8); }
.rows--tight > li {
  padding: var(--s-12) 0; background: none !important; border: 0; border-radius: 0;
  border-top: var(--border);
  font-size: var(--small); line-height: var(--small-lh); color: var(--text-2);
}

/* ---------- الريفريم + قاعدة الترقية + الختام (أغمق درجة) ---------- */
.punch { font-size: var(--h2); line-height: var(--h2-lh); font-weight: 600; color: var(--gold); }
.read > .prose + .punch { margin-top: var(--s-48); }
.sec--dark .punch .money { color: var(--text); }

/* ---------- الاقتباس (بلوك 4 — قسم فاتح) ---------- */
.quote {
  padding: var(--inner) var(--s-24);
  background: var(--ink); color: var(--light); border-radius: var(--radius);
  font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600;
}
.quote::before {
  content: "«"; display: block; margin-bottom: var(--s-8);
  font-size: var(--h2); line-height: 1; color: var(--gold);
}

/* ---------- البروف (بلوك 5) ---------- */
.proof__pair { display: grid; gap: var(--s-24); }
.proof__shot { padding: var(--s-12); background: var(--card); border: var(--border-gold); border-radius: var(--radius); }
.proof__shot img { width: 100%; border-radius: var(--radius-sm); }
.proof__shot figcaption { margin-top: var(--s-12); padding-bottom: var(--s-4); font-size: var(--small); line-height: var(--small-lh); font-weight: 600; }
.proof__cap { margin-top: var(--s-16); font-size: var(--small); line-height: var(--small-lh); color: var(--text-2); }
@media (min-width: 768px) { .proof__pair { grid-template-columns: 1fr 1fr; } }

/* ---------- شبكات الكروت ---------- */
.grid { display: grid; gap: var(--s-16); }
@media (min-width: 768px) {
  .grid { gap: var(--s-24); }
  .grid--2 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .card { padding: var(--s-32); }
}
@media (min-width: 1080px) { .grid--4 { grid-template-columns: repeat(4, 1fr); } }

/* ---------- قبل / بعد (بلوك 6) ---------- */
.ba { width: 100%; border-collapse: separate; border-spacing: 0 var(--s-8); }
.ba th { padding: 0 var(--s-24) var(--s-8); font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600; }
.ba__now { color: var(--text-2); }
.ba__after { color: var(--green-soft); }
.ba td {
  padding: var(--s-16) var(--s-24); vertical-align: top;
  background: var(--card); border-block: var(--border);
}
.ba td:first-child { color: var(--text-2); border-inline-start: var(--border); border-start-start-radius: var(--radius); border-end-start-radius: var(--radius); }
.ba td:last-child  { font-weight: 500; border-inline: var(--border); border-start-end-radius: var(--radius); border-end-end-radius: var(--radius); }
@media (max-width: 767px) {
  .ba thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ba, .ba tbody, .ba tr, .ba td { display: block; }
  .ba { border-spacing: 0; }
  .ba tr { background: var(--card); border: var(--border); border-radius: var(--radius); overflow: hidden; }
  .ba tr + tr { margin-top: var(--s-12); }
  .ba td, .ba td:first-child, .ba td:last-child { border: 0; border-radius: 0; background: none; }
  .ba td:last-child { border-top: var(--border); background: var(--card-2); }
  .ba td::before {
    content: attr(data-label); display: block; margin-bottom: var(--s-4);
    font-size: var(--micro); line-height: var(--micro-lh); font-weight: 500; color: var(--text-2);
  }
  .ba td:last-child::before { color: var(--green-soft); }
}

/* ---------- الكورسات (بلوك 7) ---------- */
.course h3 { margin-bottom: var(--s-8); }
.course h3 .num-badge { display: grid; margin: 0 auto var(--s-12); }
.course h3 .sep { display: none; }
@media (min-width: 768px) { .courses .course:first-child { grid-row: span 3; } }
.h2-pre {
  display: block; margin-bottom: var(--s-4);
  font-size: var(--body-lg); line-height: var(--body-lg-lh); font-weight: 500; color: var(--text-2);
}

/* ---------- الشرائح (بلوك 9) ---------- */
.chips { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-8); }
.chips li {
  padding: var(--s-8) var(--s-16);
  background: var(--card); border: var(--border); border-radius: var(--pill);
  font-size: var(--small); line-height: var(--small-lh);
}

/* ---------- البونصات (بلوك 11) ---------- */
.gift { display: flex; flex-direction: column; gap: var(--s-16); border: var(--border-gold); }
.gift p { color: var(--text-2); }
.gift__seal {
  margin-top: auto; padding: var(--s-8) var(--s-16);
  background: var(--bg-3); border-radius: var(--radius-sm);
  font-size: var(--small); line-height: var(--small-lh); font-weight: 600; color: var(--gold) !important;
}

/* ---------- الشهادات (بلوك 12) ---------- */
.testi { display: flex; flex-direction: column; align-items: center; gap: var(--s-16); }
.testi img { width: var(--s-64); height: var(--s-64); border-radius: 50%; object-fit: cover; border: var(--border-gold); }
.testi figcaption { display: flex; flex-direction: column; line-height: 1.7; }
.testi figcaption span { font-size: var(--small); color: var(--text-2); }
.testi blockquote { font-size: var(--small); line-height: var(--small-lh); color: var(--text-2); }
.testi blockquote > * + * { margin-top: var(--s-12); }
.testi__result {
  padding: var(--s-12) var(--s-16);
  background: var(--bg-3); border-radius: var(--radius-sm);
  font-weight: 600; color: var(--gold);
}

.subhead { margin-top: var(--s-16); }
.results li { display: flex; flex-direction: column; gap: var(--s-8); }
.results__num { font-weight: 600; font-size: var(--h3); line-height: var(--h3-lh); color: var(--gold); }
.results__who { font-size: var(--small); line-height: var(--small-lh); color: var(--text-2); }
.results__who strong { color: var(--text); }

/* ---------- مين أحمد شهاب (بلوك 13 — قسم فاتح) ---------- */
.about__photo { max-width: var(--w-btn); margin-inline: auto; padding: var(--s-12); background: var(--light-2); border: 1px solid var(--light-line); border-radius: var(--radius); }
.about__photo img { width: 100%; border-radius: var(--radius-sm); }
.about__photo figcaption { margin-top: var(--s-12); padding-bottom: var(--s-4); font-weight: 600; }

/* ---------- المسارين (بلوك 14) ---------- */
.paths { width: 100%; border-collapse: separate; border-spacing: 0; }
.paths th, .paths td { padding: var(--s-16) var(--s-24); text-align: center; vertical-align: top; border-bottom: var(--border); }
.paths thead th { font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600; }
.paths tbody th { font-size: var(--small); line-height: var(--small-lh); font-weight: 500; color: var(--text-2); }
.paths td { color: var(--text-2); }
.paths .paths__start, .paths td[data-label="START"] { background: var(--card); border-inline: var(--border-gold); color: var(--text); font-weight: 600; }
.paths .paths__start { color: var(--gold); border-top: var(--border-gold); border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); }
.paths tbody tr:last-child td[data-label="START"] { border-bottom: var(--border-gold); border-end-start-radius: var(--radius); border-end-end-radius: var(--radius); }
@media (max-width: 767px) {
  .paths thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .paths, .paths tbody, .paths tr, .paths th, .paths td { display: block; }
  .paths tr { background: var(--card); border: var(--border); border-radius: var(--radius); padding: var(--s-16) var(--s-24); }
  .paths tr + tr { margin-top: var(--s-12); }
  .paths th, .paths td, .paths td[data-label="START"], .paths tbody tr:last-child td[data-label="START"] { padding: 0; border: 0; border-radius: 0; background: none; }
  .paths tbody th { padding-bottom: var(--s-12); color: var(--text); }
  .paths td { padding-block: var(--s-8); }
  .paths td + td { border-top: var(--border); }
  .paths td::before {
    content: attr(data-label); display: block;
    font-size: var(--micro); line-height: var(--micro-lh); font-weight: 500; color: var(--text-2);
  }
  .paths td[data-label="START"]::before { color: var(--gold); }
}

/* ---------- السعر (بلوك 15) ---------- */
.price-sec:focus { outline: none; }
.checks { display: grid; gap: var(--s-8); }
.checks > li {
  display: flex; align-items: center; gap: var(--s-12); text-align: start;
  padding: var(--s-12) var(--s-16);
  background: var(--card); border: var(--border); border-radius: var(--radius-sm);
}
.checks > li::before {
  content: ""; flex: none; width: var(--s-24); height: var(--s-24); border-radius: 50%;
  background: var(--bg-3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5B400' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / var(--s-16) no-repeat;
  border: var(--border-gold);
}
.ticket {
  background: var(--card); border: var(--border-gold); border-radius: var(--radius);
  padding: var(--inner) var(--s-24);
}
.read > .checks + .ticket { margin-top: var(--s-48); }
.ticket > * + * { margin-top: var(--s-16); }
.anchor { font-size: var(--small); line-height: var(--small-lh); color: var(--text-2); }
.price { display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: var(--s-16); }
.price__old { font-size: var(--h3); color: var(--text-2); }
.price__now { font-weight: 600; font-size: var(--price); line-height: 1.4; color: var(--gold); }
.price__now small { font-size: var(--body); font-weight: 500; color: var(--text); }
.price__terms { margin-top: var(--s-4) !important; font-weight: 500; }
.scarcity {
  display: flex; flex-direction: column; align-items: center; gap: var(--s-4);
  background: var(--bg-3); border: var(--border); border-radius: var(--radius-sm);
  padding: var(--s-16) var(--s-24);
  font-size: var(--small); line-height: var(--small-lh); font-weight: 500;
}
.scarcity__n, .scarcity .countdown { color: var(--gold); font-weight: 600; }
.ticket .cta { margin-top: var(--s-24); }

.countdown { unicode-bidi: isolate; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cd-seg { display: inline-flex; flex-direction: column; align-items: center; vertical-align: middle; line-height: 1.5; }
.cd-seg small { font-size: var(--micro); font-weight: 400; color: var(--text-2); }
.cd-sep { margin-inline: var(--s-4); vertical-align: top; }

/* ---------- الضمان (بلوك 16) ---------- */
.icon { fill: none; stroke: var(--text-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.icon--lg {
  display: block; box-sizing: content-box; margin-inline: auto; padding: var(--s-16);
  stroke: var(--gold);
  background: var(--card); border: var(--border-gold); border-radius: 50%;
}
.guarantee__line { font-size: var(--h3); line-height: var(--h3-lh); font-weight: 600; color: var(--gold); }

/* ---------- الأسئلة (بلوك 17) ---------- */
.faq { display: grid; gap: var(--s-8); }
.qa { background: var(--card); border: var(--border); border-radius: var(--radius-sm); }
.qa[open] { border-color: var(--gold); }
.qa summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; gap: var(--s-12); text-align: start;
  min-height: var(--btn-h-sm); padding: var(--s-12) var(--s-16);
  font-size: var(--small); line-height: var(--small-lh); font-weight: 600;
}
.qa summary .sep { display: none; }
.qa__q { flex: 1; }
.qa summary::-webkit-details-marker { display: none; }
.qa__icon { flex: none; transition: transform 180ms ease-out; }
.qa[open] .qa__icon { transform: rotate(45deg); stroke: var(--gold); }
.qa__a { overflow: hidden; transition: max-height 180ms ease-out; }
.qa__a p { padding: 0 var(--s-16) var(--s-16); font-size: var(--small); line-height: var(--small-lh); color: var(--text-2); text-align: start; }
@media (prefers-reduced-motion: reduce) { .qa__a, .qa__icon { transition: none; } }

/* ---------- الختام (بلوك 18) ---------- */
.summary {
  background: var(--card); border: var(--border); border-radius: var(--radius);
  padding: var(--inner) var(--s-24);
  font-size: var(--small); line-height: var(--small-lh); color: var(--text-2);
}
.summary > * + * { margin-top: var(--s-8); }
.summary__key { color: var(--gold); font-weight: 600; }
.read > .price--dark { margin-top: var(--s-32); }

/* ---------- الزرار الثابت أسفل الشاشة (موبايل) ---------- */
.dock {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 40;
  padding: var(--s-8) var(--gutter) calc(var(--s-8) + env(safe-area-inset-bottom));
  background: var(--bg-3); border-top: var(--border);
  visibility: hidden; transform: translateY(100%);
}
.dock.is-visible { visibility: visible; transform: none; }
.btn--dock { min-height: var(--btn-h-sm); }
@media (min-width: 768px) { .dock { display: none; } }

/* ---------- الحركة: البلوكات بتطلع من تحت لفوق أول ما تدخل الشاشة ----------
   بتشتغل بس لما class="anim" يتحط على <html> (لو الجهاز مش مقفول عليه الحركة).
   الهيرو ثابت عشان يظهر على طول. */
.anim .sec:not(.hero) :is(.read > *, .grid > *, .proof__shot, .proof__cap, .wide > table) {
  opacity: 0; transform: translateY(var(--rise));
  transition: opacity var(--rise-dur) ease-out, transform var(--rise-dur) ease-out;
}
.anim .sec:not(.hero) .is-in.is-in { opacity: 1; transform: none; }