/* דפי המכירה של הקורסים (מנוע ב', 20.10.2026). צבעים מהפלטה הקיימת בלבד. */
.cs-video { margin: 22px auto 0; max-width: 420px; }
.cs-video--wide { max-width: 720px; }
.cs-video video { display: block; width: 100%; height: auto; border-radius: var(--radius); background: var(--navy); box-shadow: var(--shadow); }
.cs-video--sq video { aspect-ratio: 72 / 71; }
.cs-video--wide video { aspect-ratio: 16 / 9; }
.cs-video figcaption { margin-top: 8px; font-size: .85rem; text-align: center; opacity: .85; }
.cs-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.cs-list li { display: flex; gap: 10px; align-items: flex-start; }
.cs-list li::before { content: "✓"; color: var(--gold-ink); font-weight: 900; flex: none; }
.cs-shots { display: grid; gap: 18px; margin-top: 22px; }
@media (min-width: 760px) { .cs-shots { grid-template-columns: repeat(2, 1fr); align-items: start; } }
.cs-shot { margin: 0; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; text-align: center; }
.cs-shot img { display: block; width: 100%; max-width: 320px; height: auto; margin: 0 auto; border-radius: var(--radius-sm); }
.cs-shot img.cs-shot--tall { max-height: 520px; object-fit: cover; object-position: top; }
.cs-shot figcaption { margin-top: 10px; font-size: 0.95rem; color: var(--ink-2); }
.cs-examples { display: grid; gap: 12px; margin-top: 22px; }
@media (min-width: 760px) { .cs-examples { grid-template-columns: repeat(2, 1fr); } }
.cs-example { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 14px 16px; }
.cs-example h3 { font-size: 1.05rem; margin: 0 0 4px; color: var(--navy); }
.cs-example p { margin: 0; color: var(--ink-2); }
.cs-price { text-align: center; max-width: 460px; margin: 0 auto; }
.cs-price__num { font-size: 2.6rem; font-weight: 900; color: var(--navy); line-height: 1.1; }
.cs-price__sub { color: var(--ink-2); margin: 6px 0 16px; }
.cs-actions { display: grid; gap: 10px; }
.cs-actions .btn { min-height: 48px; }
.buy-note { margin: 4px 0 0; font-weight: 700; color: var(--coral-ink); }
.cs-legal { font-size: 0.85rem; color: var(--muted); margin-top: 12px; }
/* סימון לבדיקה פנימית: כל מה שעוד מחכה להחלטה. יורד לפני הפרסום */
.tbd { background: color-mix(in srgb, var(--gold) 30%, transparent); border: 1px dashed var(--gold-ink); border-radius: 6px; padding: 0 6px; font-size: 0.9em; }
.cs-testbar { margin: 0; background: var(--navy); color: #fff; text-align: center; padding: 8px 16px; font-size: 0.9rem; }
/* הכרטיס לבן בתוך אזור כהה: כותרת וכפתור משני בצבעי הכרטיס */
.cs-price h2 { color: var(--navy); }
.cs-price .btn--ghost { color: var(--navy); border-color: var(--navy); background: transparent; }

/* טופס הקנייה (מנוע ב', 20.10) */
.cs-buy{text-align:start;margin-top:8px;color:var(--navy)}
.cs-buy label,.cs-buy .check span{color:var(--navy)}
.cs-buy input[type="email"]{direction:ltr;text-align:end}
.cs-buy .form__consent{font-size:.82rem}

/* 29.10 מאור: שיחת מתנה עם כל רכישת קורס, בולט ליד הסרטון ובכרטיס המחיר */
.cs-gift { background: color-mix(in srgb, var(--gold) 22%, #fff); border: 2px solid var(--gold); border-radius: 14px; padding: 12px 16px; margin: 14px 0; color: var(--navy); text-align: start; line-height: 1.55; }
.cs-gift strong { display: block; font-size: 1.08rem; margin-bottom: 2px; }

/* לילה 1.11: מחיר, מתנה וכפתור במסך הראשון; צעדי הקנייה; בלי מוזיקה ובלי בועת וואטסאפ מעל הטופס */
.cs-offer { background: #fff; color: var(--navy); border-radius: var(--radius); padding: 16px 16px 14px; margin: 18px auto 4px; max-width: 460px; box-shadow: var(--shadow); text-align: center; }
.cs-offer__price { display: flex; align-items: baseline; justify-content: center; gap: 10px; flex-wrap: wrap; }
.cs-offer__price b { font-size: 2.3rem; font-weight: 900; line-height: 1; }
.cs-offer__price span { color: var(--ink-2); font-weight: 700; }
.cs-offer__gift { margin: 8px 0 12px; font-weight: 700; }
.cs-offer__note { margin: 10px 0 0; font-size: .85rem; color: var(--ink-2); }
.cs-offer__note a { color: inherit; text-decoration: underline; }
.cs-steps { text-align: start; margin: 4px 0 0; padding-inline-start: 22px; color: var(--navy); font-weight: 700; display: grid; gap: 4px; }
.page-course-sale .music-btn, .page-course-sale .music-hint { display: none !important; }
.cs-buy-in-view .wa-fab { opacity: 0; pointer-events: none; }
.page-course-sale .hero h1 .hl { white-space: nowrap; }

/* דפי מכירה של קורס: המחיר והכפתור מופיעים מיד, בלי אנימציית כניסה (רוב הכניסות מגיעות ממודעה בנייד) */
.page-course-sale .hero .container > div:first-child > * { animation: none; }

/* 2.11: משפך ההורים. כותרת A/B/C: course-variant.js שם data-cs-v על html; בלי JS מוצגת A */
.cs-var { display: none; }
html:not([data-cs-v]) .cs-var--A,
html[data-cs-v="A"] .cs-var--A,
html[data-cs-v="B"] .cs-var--B,
html[data-cs-v="C"] .cs-var--C { display: block; }

/* טופס בשני שלבים: בלי JS הכול גלוי ורגיל. עם JS (.is-steps) מוצג שלב אחד בכל פעם */
.cs-buy .cs-next, .cs-buy .cs-back-row { display: none; }
.cs-buy.is-steps .cs-next { display: block; margin-top: 4px; }
.cs-buy.is-steps .cs-step--2 { display: none; }
.cs-buy.is-steps[data-step="2"] .cs-step--1 { display: none; }
.cs-buy.is-steps[data-step="2"] .cs-step--2 { display: block; }
.cs-buy.is-steps[data-step="2"] .cs-back-row { display: block; }
.cs-back-row { margin: 0 0 8px; }
.cs-back { background: none; border: 0; padding: 8px 0; min-height: 44px; color: var(--navy); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.cs-back:focus-visible, .cs-next:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.cs-buy .cs-submit { margin-top: 6px; }

/* חלקי הדף החדשים */
.cs-list--moments li::before { content: "C"; font-size: 1.5rem; line-height: 1; }
.cs-after-list { margin-top: 16px; }
.cs-week { list-style: none; counter-reset: wk; padding: 0; margin: 0; display: grid; gap: 12px; }
.cs-week li { counter-increment: wk; display: grid; grid-template-columns: 36px 1fr; column-gap: 12px; align-items: start; }
.cs-week li::before { content: counter(wk); grid-row: span 2; width: 36px; height: 36px; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 900; display: flex; align-items: center; justify-content: center; }
.cs-week b { color: var(--navy); }
.cs-week span { color: var(--ink-2); }
.cs-not-therapy { margin-top: 20px; font-size: .9rem; color: var(--ink-2); text-align: center; }
.cs-offer__gift { margin: 10px 0 0; }
@media (max-width: 480px) { .cs-offer__price b { font-size: 2rem; } }
