/* ============================================================
   מסע אל הפירמידה — Reset, RTL defaults, typography
   Logical properties only. No `left` / `right` anywhere.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-block-size: 100vh;
  background: var(--sand);
  color: var(--text);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

@media (min-width: 1024px) {
  body { font-size: var(--fs-md); }
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: var(--lh-tight);
  margin-block: 0 var(--sp-3);
  color: var(--text);
}

h1 { font-size: var(--fs-2xl); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }

p  { margin-block: 0 var(--sp-4); }
ul, ol { margin-block: 0 var(--sp-4); padding-inline-start: var(--sp-5); }

a {
  color: var(--unit-1-deep);
  text-underline-offset: 3px;
}

img, svg, canvas { max-inline-size: 100%; }
img { block-size: auto; }

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

button { cursor: pointer; }

/* ---------- Numbers and formulas inside RTL text ----------
   Hebrew runs right-to-left; digits and mathematical expressions must not
   be reordered by the bidi algorithm. Every number the learner reads is
   wrapped in one of these. */
.num, bdi.num {
  unicode-bidi: isolate;
  direction: ltr;
  font-variant-numeric: tabular-nums;
}

/* An arithmetic expression sitting inside a Hebrew sentence. The operators
   are bidi-neutral, so without this the whole exercise renders mirrored.
   Marked up automatically by UI.math(). */
.math, bdi.math {
  unicode-bidi: isolate;
  direction: ltr;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.formula {
  unicode-bidi: isolate;
  direction: rtl;             /* Hebrew words inside the formula stay RTL */
  font-family: var(--font-body);
  font-weight: 500;
  white-space: nowrap;
}

/* A formula that reads left to right inside the right-to-left page.
   The direction is carried by the element's own dir attribute; this rule
   only supplies the typography and stops the formula wrapping mid-way.
   Nothing here reorders text, so assistive technology reads it in the
   same order it is written. */
.formula-ltr {
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  gap: .18em;
  font-family: var(--font-body);
  font-weight: 500;
  white-space: nowrap;
}

/* נוסחה שלמה ארוכה מדי לשורה אחת במסך צר, לכן היא
   עוברת שורה במקום לחרוג מהמסך. השבירה היא בין אסימונים
   בלבד, והסדר שלהם נשמר. */
.formula-ltr--wrap {
  flex-wrap: wrap;
  white-space: normal;
}

.formula-ltr--wrap > * { white-space: nowrap; }

/* אופרנד עברי: מבודד, כך שהכיוון שבתוכו אינו משפיע על סדר האיברים */
.formula-term { unicode-bidi: isolate; }

/* סימני פעולה מקבלים מעט אוויר משני הצדדים */
.formula-op { margin-inline: .16em; }

/* ---------- Focus ---------- */
:focus { outline: none; }

:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: var(--r-sm);
}

/* ---------- Screen-reader-only ---------- */
.sr-only {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Skip link — visible only when focused */
.skip-link {
  position: absolute;
  inset-block-start: -100px;
  inset-inline-start: var(--sp-4);
  z-index: 100;
  padding: var(--sp-3) var(--sp-4);
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
  border-radius: 0 0 var(--r-md) var(--r-md);
  transition: inset-block-start var(--dur-2) var(--ease);
}
.skip-link:focus-visible { inset-block-start: 0; }

/* ---------- Layout primitives ---------- */
.page {
  inline-size: 100%;
  max-inline-size: var(--page-max);
  margin-inline: auto;
  padding-inline: var(--sp-4);
  padding-block: var(--sp-5) var(--sp-8);
}

@media (min-width: 640px) {
  .page { padding-inline: var(--sp-5); }
}

.stack > * + * { margin-block-start: var(--sp-4); }

/* ---------- Reduced motion ----------
   Every animation on the site is decorative or has a slider equivalent,
   so it is safe to remove all of it. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .site-footer, .no-print { display: none !important; }
  body { background: #fff; }
  .page { max-inline-size: none; padding: 0; }
}

/* ---------- מספר תחנה לצד שמה ----------
   המרווח נקבע כאן ולא ברווח מוקלד: רווח שנכתב בטקסט נבלע על גבול
   הבידוד הדו־כיווני של המספר ואינו מופיע על המסך. */
.num-title {
  display: inline-flex;
  align-items: baseline;
  gap: var(--sp-2);
}

.num-title__num {
  flex: none;
  white-space: nowrap;   /* "2.10" לעולם לא נשבר באמצע */
}

.num-title__text { min-inline-size: 0; }

/* בכותרת העמוד המספר עמום יותר מהשם */
.num-title--head .num-title__num { color: var(--text-muted); }