/* =========================================================
   DOC — עמודי המסמכים: נגישות, פרטיות ותנאי שימוש.
   קובץ אחד לשלושתם, כדי ששינוי עיצובי לא ידרוש שלוש עריכות.
   ========================================================= */

.doc { max-inline-size: 760px; margin-inline: auto; }
.doc h1 { margin-block-end: var(--s-2); }
.doc .updated { color: var(--muted); font-size: var(--fs-sm); margin-block-end: var(--s-7); }

.doc h2 {
  font-size: var(--fs-h3);
  margin-block: var(--s-7) var(--s-3);
  padding-block-start: var(--s-4);
  border-block-start: 1px solid var(--line);
}
.doc h3 { margin-block: var(--s-5) var(--s-3); font-size: var(--fs-body); }

.doc p, .doc li { color: var(--muted); }
.doc p { margin-block-end: var(--s-4); }
.doc ul {
  padding-inline-start: 1.2rem;
  display: grid;
  gap: var(--s-2);
  margin-block-end: var(--s-4);
}
.doc strong { color: var(--ink); font-weight: var(--w-medium); }
.doc em { font-style: normal; text-decoration: underline; text-underline-offset: 3px; }

.doc .box {
  padding: var(--s-5);
  border-radius: var(--r-lg);
  border: 1px solid var(--line);
  margin-block: var(--s-5);
}
.doc .box p:last-child { margin-block-end: 0; }
/* טלפון ומייל בקופסה הם יעדי מגע עצמאיים, לא קישורים בתוך משפט, ולכן
   מקבלים 44px מלאים ולא נשענים על חריג ה-inline של WCAG 2.5.8. */
.doc .box a[href^='tel:'],
.doc .box a[href^='mailto:'] {
  display: inline-flex;
  align-items: center;
  min-block-size: 44px;
}
/* התקציר בראש המסמך — מסגרת מלאה, כי זה מה שרוב האנשים באמת יקראו */
.doc .box--lead { border-color: var(--ink); }
.doc .box__title {
  font-size: var(--fs-label);
  letter-spacing: .14em;
  color: var(--muted);
  margin: 0 0 var(--s-3);
  padding: 0;
  border: 0;
}

/* מה שעוד לא מולא. צהוב הוא הצבע היחיד באתר, וזו הנקודה:
   אי אפשר לפרסם את המסמך בלי לשים לב אליו. tools/check-content.py
   חוסם עלייה לאוויר כל עוד נשאר כאן ולו סימון אחד. */
.doc mark.todo {
  background: #FFE44D;
  color: #0B0B0C;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: var(--fs-sm);
  font-weight: var(--w-medium);
}

.back {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-block-size: 44px;
  margin-block-end: var(--s-5);
  color: var(--muted);
  text-decoration: none;
  font-size: var(--fs-sm);
}
.back:hover { color: var(--ink); }

.doc__nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-5);
  margin-block-start: var(--s-7);
  padding-block-start: var(--s-5);
  border-block-start: 1px solid var(--line);
}
.doc__nav a {
  display: inline-flex;
  align-items: center;
  min-block-size: 44px;
  font-size: var(--fs-sm);
  color: var(--muted);
}
.doc__nav a:hover { color: var(--ink); }