/* pages.css · העיצוב של הדפים שמחוץ לאפליקציה: תנאי שימוש, פרטיות, מחיקה, נגישות, אמירנט.
   (404.html מחזיק עותק מצומצם משלו בתוך הדף, כי עמוד שגיאה חייב לעמוד בפני עצמו · tests/122.)

   הקו: DNA-עיצוב.md · זכוכית בשלוש שכבות על כל מה שנלחץ וכרטיסי מידע, הילות ברקע, בהיר בלבד,
   כפתור ראשי אדום-כתום אחד, טקסט בדיו, בלי פס צבע צדדי ובלי קו זהב, מלל ממורכז בכרטיסים.
   ערכי הזכוכית: style.css (.lg, עדכון 20.9 «כמו אפל»).

   ⛔ CSP: style-src self · בלי ייבוא גיליונות, בלי גופנים מבחוץ, בלי תסריט. הגופנים ב-fonts/ (נתיב יחסי לקובץ הזה).
   ⛔ הדפים עצמם לא משתנים בשום מילה: כאן רק מראה. */

@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:400 900;font-display:swap;
  src:url(fonts/frank-ruhl-libre-hebrew.woff2) format('woff2');
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;}
@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:400 900;font-display:swap;
  src:url(fonts/frank-ruhl-libre-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF, U+2000-206F, U+20AC, U+2122, U+FEFF, U+FFFD;}
@font-face{font-family:'Heebo';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(fonts/heebo-hebrew.woff2) format('woff2');
  unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;}
@font-face{font-family:'Heebo';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(fonts/heebo-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF, U+2000-206F, U+20AC, U+2122, U+FEFF, U+FFFD;}

:root{
  color-scheme:light only;
  --paper:#f6f1e7; --paper-deep:#efe7d6; --card:#fffdf8; --ink:#2c2620; --ink-soft:#5e564a;
  --gold:#c9962f; --accent:#b5482e; --accent-deep:#8f3620; --line:#e3d8c4; --focus:#a17826;
  --ease:cubic-bezier(.23,1,.32,1);
}
*{box-sizing:border-box}
html{direction:rtl}

/* הבמה: ההילות הן מה שהזכוכית שוברת. מקובעות לחלון, כדי שיהיו מאחורי הכרטיסים לאורך כל הדף. */
body{margin:0;font-family:"Heebo",sans-serif;background-color:var(--paper);color:var(--ink);line-height:1.7;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(60vw 42vh at 88% -6%,rgba(201,150,47,.14),transparent 70%),
    radial-gradient(56vw 44vh at 6% 46%,rgba(181,72,46,.08),transparent 70%),
    radial-gradient(52vw 40vh at 94% 100%,rgba(201,150,47,.12),transparent 70%);
  background-repeat:no-repeat;background-attachment:fixed}
.wrap{max-width:700px;margin:0 auto;padding:26px 20px 60px}

:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}

/* ===== כותרת הדף · ממורכזת ===== */
.brand{text-align:center;font-family:"Frank Ruhl Libre",serif;font-weight:700;font-size:1.25rem;line-height:1.3}
.brand a{color:var(--accent-deep);text-decoration:none}
h1,h2,h3{font-family:"Frank Ruhl Libre",serif;font-weight:700;line-height:1.3;color:var(--ink)}
h1{font-size:clamp(1.85rem,7vw,2.3rem);margin:12px 0 10px;text-align:center;text-wrap:balance}
h2{font-size:1.25rem;margin:32px 0 8px;scroll-margin-top:14px}
h3{font-size:1.02rem;margin:20px 0 6px}
/* ⭐ נקודת האקסנט לפני כל כותרת מקטע · לא טקסט, לכן בכתום */
h2::before{content:"";display:inline-block;width:.5em;height:.5em;border-radius:50%;vertical-align:.1em;
  margin-inline-end:.55em;
  background:linear-gradient(180deg,#cd684e,var(--accent));box-shadow:0 0 0 3px rgba(181,72,46,.14)}
p{margin:8px 0}
ul,ol{margin:8px 0;padding-inline-start:22px}
ul,ol,li{margin-block:5px}
ul,ol{margin-block:8px}
li::marker{color:var(--accent)}
strong{font-weight:700}
/* קישור בתוך משפט: דיו וקו תחתי, בלי צבע ובלי זהב */
a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--accent);text-decoration-thickness:2px}
a[dir="ltr"]{white-space:nowrap;unicode-bidi:isolate}

/* ===== זכוכית · שלוש שכבות: אור (זוהר פנימי + ::before), צל (עומק ונפילה), הארה (טבעת ב-::after) ===== */
.updated,.lead,.toc,.box,.warn,.stage,details,.cta,.docnav a{
  position:relative;isolation:isolate;overflow:hidden;background:rgba(255,255,255,.05);
  backdrop-filter:blur(9px) saturate(200%) brightness(1.08);-webkit-backdrop-filter:blur(9px) saturate(200%) brightness(1.08);
  box-shadow:inset 0 0 14px rgba(255,255,255,.30),inset 0 -6px 12px -10px rgba(0,0,0,.10),0 8px 22px -14px rgba(44,38,32,.18)}
.updated::before,.lead::before,.toc::before,.box::before,.warn::before,.stage::before,details::before,.cta::before,.docnav a::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(130% 60% at 50% -12%,rgba(255,255,255,.40),rgba(255,255,255,0) 60%),
    linear-gradient(115deg,rgba(255,255,255,.20) 0%,rgba(255,255,255,0) 28%,rgba(255,255,255,0) 74%,rgba(255,255,255,.12) 100%)}
.updated::after,.lead::after,.toc::after,.box::after,.warn::after,.stage::after,details::after,.cta::after,.docnav a::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.25) 28%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.30) 74%,rgba(255,255,255,.85) 100%);
  padding:1.4px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
/* דפדפן בלי טשטוש: בלי הכלל הזה הרקע נשאר שקוף והטקסט יושב על טקסט */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .updated,.lead,.toc,.box,.warn,.stage,details,.docnav a{background:rgba(255,253,248,.9)}
}

/* ===== כרטיסי מידע · ממורכזים ===== */
.updated{display:table;margin:0 auto 22px;padding:4px 16px;border-radius:999px;font-size:.88rem;color:var(--ink-soft);text-align:center}
.lead,.toc,.box,.warn,.stage{border-radius:16px;padding:16px 18px;margin:14px 0;text-align:center;color:var(--ink)}
.lead p,.box p{margin:0 0 8px}
.lead p:last-child,.box p:last-child{margin-bottom:0}
.lead p:last-child{margin:0}
.box{font-size:.93rem}
.box p:first-child{margin-top:0}
.warn{background:rgba(181,72,46,.07)}      /* אזהרה: גוון אדום חלש, בלי קצה צבוע */
.box.note{background:rgba(255,255,255,.16)}
.stage{padding:12px 16px}
.stage b{display:block;font-family:"Frank Ruhl Libre",serif;font-size:1.06rem}
.stage b::before{content:"";display:inline-block;width:.42em;height:.42em;border-radius:50%;margin-inline-end:.5em;vertical-align:.12em;
  background:linear-gradient(180deg,#cd684e,var(--accent))}
.stage p{margin:4px 0 0}

/* תוכן העניינים: כרטיס זכוכית, הקישורים בדיו */
.toc b{display:block;font-family:"Frank Ruhl Libre",serif;font-size:1.02rem;margin-bottom:8px}
.toc ol{margin:0;padding-inline-start:22px;columns:2;column-gap:26px;font-size:.92rem;text-align:start}
@media(max-width:520px){.toc ol{columns:1}}
.toc li{margin:3px 0;break-inside:avoid}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}

/* שאלות פתוחות: כרטיס זכוכית שנלחץ */
details{border-radius:16px;margin:12px 0;padding:0}
summary{cursor:pointer;padding:10px 16px;border-radius:16px;min-height:44px}
summary::marker{color:var(--accent)}
summary:focus-visible{outline-offset:-4px}
summary h3{display:inline;margin:0}
details>:not(summary){margin:4px 16px 14px}

/* טבלאות: משטח בהיר רך, לא זכוכית (גוללות לרוחב, ושכבות העל היו נגללות איתן) */
.tblwrap{overflow-x:auto;border-radius:14px;margin:10px 0;background:rgba(255,255,255,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 8px 22px -16px rgba(44,38,32,.18)}
table{width:100%;border-collapse:collapse;font-size:.93rem;margin:0}
th,td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:right;vertical-align:top}
tr:last-child td{border-bottom:0}
th{font-weight:700;color:var(--ink-soft);font-size:.85rem}
code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.88em;background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px var(--line);
  padding:1px 5px;border-radius:5px;unicode-bidi:isolate;direction:ltr;display:inline-block}
td code{white-space:nowrap}
@media (max-width:600px){td code{white-space:normal;overflow-wrap:anywhere}}   /* בטלפון הטבלה לא גולשת לצד, אחרת אי אפשר לגלול אותה במקלדת */
.small{font-size:.86rem;color:var(--ink-soft)}
.warn .small,.box .small{color:var(--ink)}   /* על גוון האזהרה ink-soft יורד מתחת ל-4.5 (נמדד) */
.src{color:var(--ink-soft);font-size:.88rem;text-align:center}
/* שם כפתור אמיתי מהאפליקציה · נשבר לשתי שורות ב-375 ונקרא כשני כפתורים */
.ui{white-space:nowrap}

/* ===== כפתור ראשי · יחיד בדף · זכוכית צבועה באדום עמוק ===== */
.cta,.docnav a:first-child{color:#fff;text-decoration:none;text-shadow:0 1px 1px rgba(0,0,0,.25);
  background:linear-gradient(180deg,rgba(160,58,36,.94),rgba(143,54,32,.96));
  box-shadow:inset 0 0 12px rgba(255,210,190,.1),inset 0 -8px 16px -12px rgba(0,0,0,.28),0 12px 28px -12px rgba(143,54,32,.6)}
.cta::before,.docnav a:first-child::before{
  background:radial-gradient(130% 70% at 50% -10%,rgba(255,255,255,.16),rgba(255,255,255,0) 60%),
    radial-gradient(90% 50% at 50% 115%,rgba(255,200,180,.18),rgba(255,255,255,0) 60%)}
.cta{display:flex;align-items:center;justify-content:center;text-align:center;min-height:54px;margin:22px 0 8px;padding:0 22px;
  border-radius:14px;font-weight:600;font-size:1.02rem;letter-spacing:-.01em}

/* ===== ניווט תחתון · כפתורי זכוכית. הפסיקים שבין הקישורים נשארים בטקסט ולא נראים ===== */
.docnav{margin-top:44px;padding-top:6px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px;font-size:0;color:var(--ink-soft)}
.docnav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:14px;
  font-size:.92rem;font-weight:600;color:var(--ink);text-decoration:none;letter-spacing:-.01em}
.docnav a:first-child{color:#fff}
/* באמירנט הכפתור הראשי הוא ההתחלה, וחזרה היא זכוכית שקופה */
.cta ~ .docnav a:first-child{color:var(--ink);text-shadow:none;background:rgba(255,255,255,.16);
  box-shadow:inset 0 0 14px rgba(255,255,255,.30),inset 0 -6px 12px -10px rgba(0,0,0,.10),0 8px 22px -14px rgba(44,38,32,.18)}
.cta ~ .docnav a:first-child::before{background:radial-gradient(130% 60% at 50% -12%,rgba(255,255,255,.40),rgba(255,255,255,0) 60%),
  linear-gradient(115deg,rgba(255,255,255,.20) 0%,rgba(255,255,255,0) 28%,rgba(255,255,255,0) 74%,rgba(255,255,255,.12) 100%)}
@media (hover:hover){
  .cta:hover,.docnav a:hover{filter:brightness(1.06);text-decoration:none}
  .toc a:hover{color:var(--accent-deep)}
}
.cta,.docnav a,summary{transition:transform .12s ease,filter .2s ease}
.cta:active,.docnav a:active{transform:scale(.97)}

/* ===== מושן · כניסה עדינה של ראש הדף והכרטיסים הראשונים ===== */
@keyframes rise{from{opacity:0;transform:translateY(6px)}}
.wrap>*:nth-child(-n+8){animation:rise .45s var(--ease) backwards}
.wrap>*:nth-child(2){animation-delay:.06s}
.wrap>*:nth-child(3){animation-delay:.12s}
.wrap>*:nth-child(4){animation-delay:.18s}
.wrap>*:nth-child(5){animation-delay:.24s}
.wrap>*:nth-child(6){animation-delay:.3s}
.wrap>*:nth-child(7){animation-delay:.36s}
.wrap>*:nth-child(8){animation-delay:.42s}
/* בהדפסה ובשמירה כ-PDF אין זמן לאנימציה, והרכיבים נשארים שקופים */
@media print{.wrap>*{animation:none!important}}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}